:root{color:#17384c;background:#f4fbfa;font-family:Trebuchet MS,Avenir Next,Avenir,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}button{font:inherit}.page-shell{position:relative;display:grid;min-height:100vh;place-items:center;overflow:hidden;background:#f4fbfa}.lesson-card{position:relative;display:flex;width:100%;min-height:100vh;flex-direction:column;align-items:center;justify-content:center;padding:30px 42px 28px}.lesson-number,.step-kicker{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.visual-stage{position:relative;width:min(88vw,930px);height:min(56vh,500px);min-height:310px;overflow:hidden;border-radius:32px;background:radial-gradient(circle at 50% 45%,#ffffff 0,#ffffff 32%,transparent 70%),#e8f6f4}.visual-scene{position:absolute;top:0;right:0;bottom:0;left:0;display:none}.visual-scene.active{display:block;animation:sceneIn .42s ease both}.cell-shape{position:absolute;top:8%;right:16%;bottom:8%;left:16%;border:5px solid #98cfca;border-radius:44% 48% 43% 50%;background:#ffffff7a}.cell-label,.cytoplasm-label{position:absolute;color:#6c9697;font-size:.7rem;font-weight:700;letter-spacing:.12em}.cell-label{bottom:16px;left:50%;transform:translate(-50%)}.nucleus{position:absolute;top:50%;left:50%;width:min(36%,330px);height:72%;min-width:250px;border:5px solid #7fbdbe;border-radius:50%;background:#d9f0ee;box-shadow:inset 0 0 0 12px #fff6;transform:translate(-50%,-50%)}.nucleus-label{position:absolute;top:18px;left:50%;color:#177c7e;font-size:.75rem;font-weight:700;letter-spacing:.13em;transform:translate(-50%)}.dna-helix{position:absolute;top:25%;left:50%;width:160px;height:60%;transform:translate(-50%) rotate(-9deg)}.helix-rail{position:absolute;top:0;width:34px;height:100%;border:5px solid #f18665;border-top-color:transparent;border-bottom-color:transparent;border-radius:50%}.helix-rail-left{left:11px}.helix-rail-right{right:11px;border-color:#1a8988;border-top-color:transparent;border-bottom-color:transparent}.helix-rung{position:absolute;left:27px;width:106px;height:5px;border-radius:3px;background:#e6b29d}.rung-one{top:8%}.rung-two{top:29%;background:#96cbca}.rung-three{top:50%}.rung-four{top:71%;background:#96cbca}.rung-five{top:92%}.gene-highlight{position:absolute;top:46%;left:50%;display:grid;width:100px;height:64px;place-items:center;border:4px dashed #f18665;border-radius:12px;color:#c35e43;background:#ffefe8c7;font-size:.68rem;font-weight:700;letter-spacing:.12em;transform:translate(-50%,-50%)}.scene-one .nucleus{perspective:900px;background:radial-gradient(circle at 32% 24%,rgba(255,255,255,.8),transparent 32%),radial-gradient(circle at 70% 78%,rgba(93,169,171,.14),transparent 48%),#d9f0ee;box-shadow:inset 15px 12px #ffffff70,inset -16px -18px #4f9b9d1f,0 16px 24px #4f9b9d21}.scene-one .dna-helix{top:14%;width:220px;height:74%;transform-style:preserve-3d;filter:drop-shadow(0 14px 9px rgba(38,104,111,.18));animation:dnaRotate3d 18s ease-in-out infinite}.scene-one .dna-helix:before{position:absolute;top:-12%;right:13%;bottom:-12%;left:13%;z-index:-1;content:"";border-radius:50%;background:radial-gradient(ellipse,rgba(255,255,255,.7) 0,rgba(255,255,255,.16) 44%,transparent 72%);transform:translateZ(-18px) scale(1.12,1.03)}.scene-one .helix-rail{width:48px;border-width:10px;border-radius:50%;box-shadow:inset 4px 0 #ffffff6b,5px 0 #22686e1a;transform-style:preserve-3d}.scene-one .helix-rail:after{position:absolute;top:8%;width:8px;height:30%;content:"";border-radius:50%;background:#fff9;filter:blur(1px)}.scene-one .helix-rail-left{left:24px;border-color:#ed8060;border-top-color:transparent;border-bottom-color:transparent;background:linear-gradient(90deg,#bc5c48 0,#f59b79 36%,#ffd0b8 62%,#d76d52)}.scene-one .helix-rail-left:after{left:5px}.scene-one .helix-rail-right{right:24px;border-color:#178082;border-top-color:transparent;border-bottom-color:transparent;background:linear-gradient(90deg,#0e5e68 0,#32a4a0 40%,#a5e0d7 64%,#147176)}.scene-one .helix-rail-right:after{right:5px}.scene-one .helix-rung{left:40px;width:140px;height:14px;border:3px solid rgba(255,255,255,.52);border-radius:999px;background:linear-gradient(180deg,#ffd6bd 0,#ed987c 44%,#b65);box-shadow:0 4px #8449412e,inset 0 2px 1px #ffffffb8;transform:translateZ(12px) rotateY(-7deg)}.scene-one .helix-rung:before,.scene-one .helix-rung:after{position:absolute;top:50%;width:19px;height:19px;content:"";border:3px solid rgba(255,255,255,.52);border-radius:50%;background:inherit;box-shadow:inset 0 2px 2px #ffffff80;transform:translateY(-50%)}.scene-one .helix-rung:before{left:-12px}.scene-one .helix-rung:after{right:-12px}.scene-one .rung-two,.scene-one .rung-four{background:linear-gradient(180deg,#c9f1e8 0,#63bcb6 46%,#278b8c)}.scene-one .rung-one{transform:translateZ(-5px) rotateY(9deg) scaleX(.82)}.scene-one .rung-two{transform:translateZ(14px) rotateY(-8deg) scaleX(.94)}.scene-one .rung-three{transform:translateZ(20px) rotateY(7deg) scaleX(1)}.scene-one .rung-four{transform:translateZ(14px) rotateY(-8deg) scaleX(.94)}.scene-one .rung-five{transform:translateZ(-5px) rotateY(9deg) scaleX(.82)}.scene-one .gene-highlight{z-index:2;width:142px;height:92px;border:4px solid rgba(255,172,126,.95);border-radius:24px;color:#b9583e;background:linear-gradient(135deg,#fff8efb8,#ffd8bc7a),#ffefe88f;box-shadow:0 0 0 5px #ffbe911f,0 0 24px #ff966961,inset 0 3px 4px #ffffffb8,inset 0 -7px 12px #da684b1f;transform:translate(-50%,-50%) rotate(-4deg);animation:genePulse3d 2.2s ease-in-out infinite}.scene-one .gene-highlight:before,.scene-one .gene-highlight:after{position:absolute;left:16px;right:16px;height:3px;content:"";border-radius:99px;background:#ef855f61}.scene-one .gene-highlight:before{top:23px}.scene-one .gene-highlight:after{bottom:23px}.polymerase{position:absolute;top:46%;left:22%;display:grid;width:100px;height:64px;place-items:center;border:4px solid #f18665;border-radius:50%;color:#a84d37;background:#ffe2d8;font-size:.58rem;font-weight:700;line-height:1.15;text-align:center;box-shadow:0 5px #f1866529;animation:polymeraseMove 3.6s ease-in-out infinite}.mrna-transcript{position:absolute;top:67%;left:24%;display:flex;gap:8px;width:0;overflow:hidden;transform:rotate(7deg);animation:transcriptGrow 3.6s ease-in-out infinite}.mrna-transcript i,.mrna-travel i{flex:0 0 15px;width:15px;height:15px;border:4px solid #f18665;border-radius:50%;background:#fff}.mrna-transcript i:nth-child(2n),.mrna-travel i:nth-child(2n){border-color:#177c7e}.mini-helix{top:28%;left:30%;width:120px;height:48%}.mini-helix .helix-rail{height:100%}.mini-helix .helix-rung{left:20px;width:80px}.nucleus-with-pore{left:36%}.nuclear-pore{position:absolute;top:42%;right:-25px;display:grid;width:50px;height:58px;place-items:center;border:5px solid #177c7e;border-radius:50%;color:#177c7e;background:#eaf5f4;font-size:2.4rem;line-height:.5}.cytoplasm-label{top:13%;right:13%}.mrna-travel{position:absolute;top:47%;left:43%;display:flex;align-items:center;gap:8px;min-width:245px;transform:translate(-20px);animation:mrnaExit 2.8s ease-in-out infinite}.mrna-travel b{position:absolute;top:-33px;left:54px;color:#177c7e;font-size:.76rem;letter-spacing:.1em}.translation-stage{position:absolute;top:0;right:0;bottom:0;left:0}.stage-label,.chain-label{position:absolute;color:#177c7e;font-size:.72rem;font-weight:700;letter-spacing:.1em}.label-mrna{top:70%;left:10%}.mrna-line{position:absolute;top:77%;left:10%;width:80%;height:13px;border-top:5px solid #f18665;border-bottom:5px solid #f18665;border-radius:50%}.ribosome{position:absolute;top:36%;left:50%;width:210px;height:112px;transform:translate(-50%);animation:ribosomeFloat 1.8s ease-in-out infinite}.ribosome i{position:absolute;left:50%;display:block;border:5px solid #177c7e;background:#c9e9e6;transform:translate(-50%)}.ribosome-top{top:0;width:158px;height:70px;border-radius:58% 58% 45% 45%}.ribosome-bottom{bottom:0;width:210px;height:63px;border-radius:42% 42% 54% 54%}.ribosome b{position:absolute;top:52px;left:50%;color:#12696b;font-size:.68rem;letter-spacing:.1em;transform:translate(-50%)}.trna{position:absolute;top:6%;width:84px;height:92px;border:5px solid #e6b29d;border-top-color:transparent;border-radius:0 0 46px 46px;animation:trnaDrop 2.8s ease-in-out infinite}.trna:before,.trna:after{position:absolute;content:"";width:5px;height:46px;border-radius:3px;background:#e6b29d}.trna:before{top:-5px;left:8px;transform:rotate(26deg)}.trna:after{top:-5px;right:8px;transform:rotate(-26deg)}.trna-a{left:15%}.trna-b{left:44%;animation-delay:.3s}.trna-c{right:15%;animation-delay:.6s}.trna-loop{position:absolute;bottom:10px;left:50%;width:27px;height:20px;border:4px solid #e6b29d;border-radius:50%;transform:translate(-50%)}.amino-acid{position:absolute;top:-32px;left:50%;display:grid;width:34px;height:34px;place-items:center;border:4px solid #f18665;border-radius:50%;color:#a84d37;background:#ffe2d8;font-size:.72rem;transform:translate(-50%)}.chain-label{bottom:7%;left:50%;color:#da7152;font-size:.68rem;transform:translate(-50%)}.amino-chain{position:absolute;bottom:15%;left:50%;display:flex;gap:0;transform:translate(-50%)}.amino-chain i{position:relative;display:block;width:36px;height:36px;margin-left:-4px;border:4px solid #f18665;border-radius:50%;background:#ffe2d8;animation:chainGrow 1.8s ease-out both}.amino-chain i:nth-child(2){animation-delay:.18s}.amino-chain i:nth-child(3){animation-delay:.36s}.amino-chain i:nth-child(4){animation-delay:.54s}.amino-chain i:nth-child(5){animation-delay:.72s}.protein-canvas{position:absolute;top:0;right:0;bottom:0;left:0;text-align:center}.protein-caption,.protein-result{position:absolute;left:50%;color:#177c7e;font-size:.72rem;font-weight:700;letter-spacing:.1em;transform:translate(-50%)}.protein-caption{top:7%}.protein-arrow{position:absolute;top:15%;left:50%;color:#f18665;font-size:1.7rem;transform:translate(-50%)}.protein-fold{position:absolute;top:22%;left:50%;width:270px;height:210px;border:9px solid #177c7e;border-radius:44% 56% 49% 51%;background:#c9e9e6;box-shadow:inset 25px 20px #ffffff61,inset -24px -16px #177c7e1a;transform:translate(-50%);animation:proteinFold 1.4s ease-out both}.protein-fold:before,.protein-fold:after{position:absolute;content:"";border:5px solid #f18665;border-radius:50%}.protein-fold:before{top:40px;left:32px;width:105px;height:60px;transform:rotate(20deg)}.protein-fold:after{right:32px;bottom:35px;width:92px;height:67px;transform:rotate(-25deg)}.protein-node{position:absolute;z-index:1;display:block;width:25px;height:25px;border:4px solid #da7152;border-radius:50%;background:#ffe2d8}.protein-node-one{top:38px;left:98px}.protein-node-two{top:85px;right:47px}.protein-node-three{bottom:33px;left:80px}.protein-node-four{bottom:69px;left:32px}.protein-node-five{top:35px;right:66px}.protein-node-six{bottom:28px;right:92px}.protein-node-seven{top:96px;left:49px}.protein-result{bottom:7%;color:#da7152}.lesson-content{width:min(100%,800px);min-height:80px;text-align:center}#step-title{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.step-description{max-width:760px;margin:0 auto;color:#3e626b;font-size:clamp(1rem,2vw,1.28rem);line-height:1.45}.lesson-controls{display:flex;width:min(100%,550px);gap:12px;margin-top:16px}.next-button,.back-button,.replay-button{min-height:51px;border-radius:13px;cursor:pointer;font-size:.76rem;font-weight:700;letter-spacing:.12em;transition:transform .16s ease,background-color .16s ease,box-shadow .16s ease,opacity .16s ease}.next-button,.replay-button{flex:1;border:0;color:#fff;background:#177c7e;box-shadow:0 8px 16px #177c7e33}.back-button{flex:0 0 120px;border:2px solid #cfe4e3;color:#527078;background:transparent}.back-button:not(:disabled):hover,.next-button:hover,.replay-button:hover{transform:translateY(-2px)}.next-button:hover,.replay-button:hover{background:#12696b;box-shadow:0 11px 22px #177c7e40}.back-button:not(:disabled):hover{border-color:#9bceca;color:#177c7e}.back-button:disabled{cursor:not-allowed;opacity:.34}.next-button:active,.back-button:not(:disabled):active,.replay-button:active{transform:translateY(1px)}.next-button:focus-visible,.back-button:focus-visible,.replay-button:focus-visible{outline:4px solid rgba(241,134,101,.35);outline-offset:3px}.button-arrow{margin-left:8px;font-size:1.2rem;font-weight:400;letter-spacing:0;line-height:.5}.progress-row{width:min(100%,550px);gap:16px;margin-top:13px}.progress-label{flex:0 0 auto;color:#8aa5a6;font-size:.68rem;font-weight:700;letter-spacing:.04em}.progress-track{width:100%;height:4px;overflow:hidden;border-radius:10px;background:#dceceb}.progress-fill{display:block;width:20%;height:100%;border-radius:inherit;background:#f18665;transition:width .22s ease}@keyframes sceneIn{0%{opacity:0;transform:translateY(8px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes genePulse{0%,to{box-shadow:0 0 #f1866500}50%{box-shadow:0 0 0 9px #f1866526}}@keyframes dnaRotate3d{0%,to{transform:translate(-50%) rotateX(2deg) rotateY(-10deg) rotate(-9deg)}50%{transform:translate(-50%) rotateX(-2deg) rotateY(10deg) rotate(-9deg)}}@keyframes genePulse3d{0%,to{box-shadow:0 0 0 5px #ffbe911f,0 0 24px #ff966961,inset 0 3px 4px #ffffffb8,inset 0 -7px 12px #da684b1f;transform:translate(-50%,-50%) rotate(-4deg) scale(1)}50%{box-shadow:0 0 0 9px #ffbe9129,0 0 38px #ff9669a3,inset 0 3px 4px #ffffffd6,inset 0 -7px 12px #da684b1f;transform:translate(-50%,-50%) rotate(-4deg) scale(1.035)}}@keyframes polymeraseMove{0%,to{transform:translate(0)}50%{transform:translate(150px)}}@keyframes transcriptGrow{0%,20%{width:0}72%,to{width:135px}}@keyframes mrnaExit{0%,15%{opacity:0;transform:translate(-24px)}35%,78%{opacity:1}to{opacity:.3;transform:translate(105px)}}@keyframes ribosomeFloat{0%,to{transform:translate(-50%) translateY(0)}50%{transform:translate(-50%) translateY(-5px)}}@keyframes trnaDrop{0%,to{transform:translateY(0)}50%{transform:translateY(22px)}}@keyframes chainGrow{0%{opacity:0;transform:scale(.4)}to{opacity:1;transform:scale(1)}}@keyframes proteinFold{0%{opacity:0;transform:translate(-50%) rotate(-25deg) scale(.6)}to{opacity:1;transform:translate(-50%) rotate(0) scale(1)}}@media(max-width:600px){.lesson-card{padding:20px 16px 19px}.visual-stage{width:100%;height:48vh;min-height:270px;border-radius:22px}.cell-shape{top:10%;right:5%;bottom:10%;left:5%}.nucleus{width:52%;min-width:190px;height:68%}.dna-helix{width:125px}.helix-rail{width:27px;border-width:4px}.helix-rung{left:22px;width:81px;height:4px}.gene-highlight{width:83px;height:52px;border-width:3px;font-size:.58rem}.polymerase{left:12%;width:78px;height:52px;border-width:3px;font-size:.46rem}.mrna-transcript{left:18%;gap:5px}.mrna-transcript i,.mrna-travel i{flex-basis:12px;width:12px;height:12px;border-width:3px}.nucleus-with-pore{left:35%}.nuclear-pore{right:-19px;width:38px;height:46px;border-width:4px;font-size:1.7rem}.cytoplasm-label{right:6%;font-size:.58rem}.mrna-travel{left:43%;min-width:170px;gap:5px;transform:scale(.8) translate(-20px);transform-origin:left center}.ribosome{width:150px;height:84px}.ribosome-top{width:112px;height:53px}.ribosome-bottom{width:150px;height:47px}.ribosome b{top:38px;font-size:.5rem}.trna{width:56px;height:63px;border-width:3px}.trna-a{left:7%}.trna-c{right:7%}.trna:before,.trna:after{width:3px;height:31px}.amino-acid{top:-22px;width:25px;height:25px;border-width:3px;font-size:.55rem}.protein-fold{width:215px;height:166px}@keyframes proteinFold{0%{opacity:0;transform:translate(-50%) rotate(-25deg) scale(.6)}to{opacity:1;transform:translate(-50%) rotate(0) scale(.8)}}.protein-result,.protein-caption,.stage-label,.chain-label{font-size:.56rem}.lesson-content{min-height:84px}.step-description{font-size:.9rem}.lesson-controls{gap:8px}.back-button{flex-basis:96px;font-size:.66rem}.next-button,.replay-button{font-size:.68rem}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.lesson-card:has(.scene-one.active){padding:0;justify-content:initial;background:#071b45}.lesson-card:has(.scene-one.active) .visual-stage{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;min-height:0;border-radius:0;background:radial-gradient(circle at 50% 42%,rgba(102,76,207,.42),transparent 38%),radial-gradient(circle at 15% 20%,rgba(33,145,224,.4),transparent 32%),linear-gradient(145deg,#0d2b64,#10245d 48%,#07183f)}.lesson-card:has(.scene-one.active) .scene-one.active{display:block}.lesson-card:has(.scene-one.active) .scene-one .cell-shape{top:-9%;right:-7%;bottom:-9%;left:-7%;overflow:hidden;border:3px solid rgba(127,217,255,.46);border-radius:47% 53% 51% 49%/49% 44% 56% 51%;background:radial-gradient(circle at 20% 25%,rgba(117,218,255,.55) 0 1.5%,transparent 2%),radial-gradient(circle at 84% 23%,rgba(138,109,247,.5) 0 1%,transparent 1.7%),radial-gradient(circle at 9% 72%,rgba(120,207,255,.4) 0 1.2%,transparent 1.8%),radial-gradient(circle at 76% 80%,rgba(144,110,244,.4) 0 1.1%,transparent 1.8%),radial-gradient(ellipse at 50% 45%,rgba(56,121,214,.5),transparent 63%),linear-gradient(145deg,#49a6ec61,#141f5d75);box-shadow:inset 0 0 0 8px #86e1ff1a,inset 0 0 70px #14348f85,0 0 60px #2d9af247;transform:scale(1.04);animation:cellCameraZoom 14s ease-in-out infinite}.lesson-card:has(.scene-one.active) .scene-one .cell-shape:before{position:absolute;top:1.8%;right:1.8%;bottom:1.8%;left:1.8%;content:"";border:6px solid rgba(122,224,255,.25);border-radius:inherit;box-shadow:inset 0 0 18px #b3efff4d,0 0 18px #6ccfff40}.lesson-card:has(.scene-one.active) .scene-one .cell-shape:after{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;content:"";opacity:.62;background:radial-gradient(ellipse at 14% 37%,rgba(214,137,246,.44) 0 3.5%,transparent 4%),radial-gradient(ellipse at 87% 56%,rgba(32,188,246,.34) 0 4%,transparent 4.6%),radial-gradient(ellipse at 28% 86%,rgba(42,199,255,.3) 0 2.7%,transparent 3.4%),radial-gradient(ellipse at 74% 13%,rgba(177,99,246,.3) 0 2.4%,transparent 3.2%);filter:blur(8px)}.lesson-card:has(.scene-one.active) .scene-one .cell-label{display:none}.lesson-card:has(.scene-one.active) .scene-one .nucleus{z-index:1;width:clamp(300px,43vw,620px);height:clamp(430px,76vh,770px);min-width:0;border:12px solid rgba(217,151,255,.68);border-radius:50%;background:radial-gradient(circle at 31% 20%,rgba(255,210,255,.38),transparent 23%),radial-gradient(circle at 72% 78%,rgba(22,9,87,.45),transparent 48%),radial-gradient(ellipse at 50% 43%,#5325a4f0,#180c4bfa 70%);box-shadow:inset 22px 18px #ffd5ff29,inset -28px -26px #0f054161,0 0 0 7px #673acd4d,0 22px 55px #03062380,0 0 44px #b96dff57;animation:nucleusFloat3d 12s ease-in-out infinite}.lesson-card:has(.scene-one.active) .scene-one .nucleus:before{position:absolute;top:2%;right:2%;bottom:2%;left:2%;content:"";border:4px solid rgba(242,190,255,.23);border-radius:50%;box-shadow:inset 0 0 25px #d582ff47,0 0 12px #cf83ff40}.lesson-card:has(.scene-one.active) .scene-one .nucleus:after{position:absolute;top:11%;right:11%;bottom:11%;left:11%;content:"";border:2px solid rgba(229,176,255,.14);border-radius:49% 51% 45% 55%;transform:rotate(18deg)}.lesson-card:has(.scene-one.active) .scene-one .nucleus-label{z-index:4;top:10%;color:#ffefffe6;font-size:clamp(.66rem,1vw,.82rem);letter-spacing:.08em;text-transform:none;text-shadow:0 2px 9px rgba(12,4,52,.7)}.lesson-card:has(.scene-one.active) .scene-one .dna-helix{z-index:3;top:11%;width:clamp(220px,24vw,350px);height:78%;perspective:850px;transform-style:preserve-3d;filter:drop-shadow(0 18px 9px rgba(4,2,35,.5));animation:dnaRotate3d 18s ease-in-out infinite}.lesson-card:has(.scene-one.active) .scene-one .dna-svg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 8px 7px rgba(5,2,38,.36));transform-style:preserve-3d}.lesson-card:has(.scene-one.active) .scene-one .dna-helix>.helix-rail,.lesson-card:has(.scene-one.active) .scene-one .dna-helix>.helix-rung{display:none}.lesson-card:has(.scene-one.active) .scene-one .dna-rung{fill:none;stroke:#62d6f5;stroke-linecap:round;stroke-width:13;filter:drop-shadow(0 3px 2px rgba(10,4,63,.42))}.lesson-card:has(.scene-one.active) .scene-one .gene-rung{stroke:#ffb23b;filter:url(#dna-glow);animation:geneRungGlow 2.2s ease-in-out infinite}.lesson-card:has(.scene-one.active) .scene-one .dna-strand{fill:none;stroke-linecap:round;stroke-width:15;filter:drop-shadow(0 3px 3px rgba(9,3,52,.42))}.lesson-card:has(.scene-one.active) .scene-one .strand-cyan{stroke:url(#dna-cyan-strand)}.lesson-card:has(.scene-one.active) .scene-one .strand-purple{stroke:url(#dna-purple-strand)}.lesson-card:has(.scene-one.active) .scene-one .gene-strand{stroke:#ffb83f;stroke-width:20;filter:url(#dna-glow);animation:geneStrandPulse 2.2s ease-in-out infinite}.lesson-card:has(.scene-one.active) .scene-one .dna-helix:before{top:-8%;right:7%;bottom:-8%;left:7%;background:radial-gradient(ellipse,rgba(178,121,255,.35) 0,rgba(83,190,255,.1) 45%,transparent 70%);transform:translateZ(-24px) scale(1.14,1.06)}.lesson-card:has(.scene-one.active) .scene-one .helix-rail{width:52px;border-width:12px;background:transparent;box-shadow:inset 5px 0 #ffffff47,6px 0 #06022b33,0 0 12px #5bd2ff42}.lesson-card:has(.scene-one.active) .scene-one .helix-rail-left{left:24px;border-color:#30c9ff;border-top-color:transparent;border-bottom-color:transparent}.lesson-card:has(.scene-one.active) .scene-one .helix-rail-right{right:24px;border-color:#a86dff;border-top-color:transparent;border-bottom-color:transparent}.lesson-card:has(.scene-one.active) .scene-one .helix-rail:before{position:absolute;top:37%;width:100%;height:27%;content:"";border:8px solid #ffb33e;border-top-color:transparent;border-bottom-color:transparent;border-radius:50%;box-shadow:0 0 12px #ff7d38,0 0 24px #ff712dc2;animation:geneStrandGlow 2.2s ease-in-out infinite}.lesson-card:has(.scene-one.active) .scene-one .helix-rail:after{top:7%;width:9px;height:28%;background:#ffffffa3;box-shadow:0 0 8px #fff9}.lesson-card:has(.scene-one.active) .scene-one .helix-rung{left:39px;width:142px;height:13px;border:3px solid rgba(241,225,255,.56);border-radius:999px;background:linear-gradient(180deg,#8ceaff 0,#2a9ee9 48%,#3b4ec6);box-shadow:0 4px #08033857,0 0 9px #43c0ff7a,inset 0 2px 2px #ffffffb8}.lesson-card:has(.scene-one.active) .scene-one .helix-rung:before,.lesson-card:has(.scene-one.active) .scene-one .helix-rung:after{width:18px;height:18px;border:3px solid rgba(241,225,255,.54);background:inherit;box-shadow:inset 0 2px 2px #ffffff8f}.lesson-card:has(.scene-one.active) .scene-one .rung-one{top:2%;transform:translateZ(-8px) rotateY(11deg) scaleX(.78)}.lesson-card:has(.scene-one.active) .scene-one .rung-two{top:14%;transform:translateZ(7px) rotateY(-10deg) scaleX(.9)}.lesson-card:has(.scene-one.active) .scene-one .rung-three{top:26%;transform:translateZ(18px) rotateY(8deg) scaleX(1)}.lesson-card:has(.scene-one.active) .scene-one .rung-four{top:38%;transform:translateZ(24px) rotateY(-7deg) scaleX(1.03)}.lesson-card:has(.scene-one.active) .scene-one .rung-five{top:50%;transform:translateZ(26px) rotateY(6deg) scaleX(1.05)}.lesson-card:has(.scene-one.active) .scene-one .rung-six{top:62%;transform:translateZ(22px) rotateY(-7deg) scaleX(1.02)}.lesson-card:has(.scene-one.active) .scene-one .rung-seven{top:74%;transform:translateZ(13px) rotateY(9deg) scaleX(.95)}.lesson-card:has(.scene-one.active) .scene-one .rung-eight{top:86%;transform:translateZ(1px) rotateY(-10deg) scaleX(.86)}.lesson-card:has(.scene-one.active) .scene-one .rung-nine{top:98%;transform:translateZ(-8px) rotateY(11deg) scaleX(.74)}.lesson-card:has(.scene-one.active) .scene-one .rung-four,.lesson-card:has(.scene-one.active) .scene-one .rung-five,.lesson-card:has(.scene-one.active) .scene-one .rung-six{background:linear-gradient(180deg,#fff2a5 0,#ffab38 42%,#ef5f35);box-shadow:0 4px #691b2861,0 0 11px #ff7829d9,0 0 24px #ff6b228f,inset 0 2px 2px #ffffffd6;animation:geneRungGlow 2.2s ease-in-out infinite}.lesson-card:has(.scene-one.active) .scene-one .gene-highlight{top:48%;left:calc(50% + min(35vw,185px));z-index:5;display:block;width:72px;height:28px;border:0;border-radius:0;color:transparent;background:transparent;box-shadow:none;font-size:0;transform:none;animation:geneLabelGlow 2.2s ease-in-out infinite}.lesson-card:has(.scene-one.active) .scene-one .gene-highlight:before{top:50%;left:-104px;width:92px;height:2px;border:0;border-radius:99px;background:linear-gradient(90deg,#ffb137f0,#ffe189c7);box-shadow:0 0 8px #ff8429e0;transform:rotate(-7deg)}.lesson-card:has(.scene-one.active) .scene-one .gene-highlight:after{top:50%;left:0;right:auto;bottom:auto;width:auto;height:auto;content:"Gene";border:0;border-radius:0;color:#fff3fff0;background:transparent;box-shadow:none;font-size:.82rem;font-weight:700;letter-spacing:.04em;text-shadow:0 2px 9px rgba(12,4,52,.8);transform:translateY(-50%)}.lesson-card:has(.scene-one.active) .lesson-content{position:fixed;bottom:clamp(78px,10vh,116px);left:50%;z-index:5;width:min(90vw,760px);min-height:0;transform:translate(-50%)}.lesson-card:has(.scene-one.active) .step-description{color:#fff7fff0;font-size:clamp(.95rem,1.8vw,1.18rem);text-shadow:0 2px 10px rgba(4,3,36,.7)}.lesson-card:has(.scene-one.active) .lesson-controls{position:fixed;right:clamp(22px,4vw,64px);bottom:clamp(20px,4vh,42px);z-index:6;width:auto;margin-top:0}.lesson-card:has(.scene-one.active) .back-button,.lesson-card:has(.scene-one.active) .progress-row{display:none}.lesson-card:has(.scene-one.active) .next-button{flex:0 0 auto;min-width:140px;border-radius:999px;color:#fff;background:linear-gradient(135deg,#218df7,#4e60e6);box-shadow:0 8px 20px #0308435c,inset 0 1px #ffffff4d}@keyframes cellCameraZoom{0%,to{transform:scale(1.035)}50%{transform:scale(1.075)}}@keyframes nucleusFloat3d{0%,to{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-50%) scale(1.018)}}@keyframes geneStrandGlow{0%,to{filter:brightness(1);opacity:.82}50%{filter:brightness(1.35);opacity:1}}@keyframes geneStrandPulse{0%,to{opacity:.78;stroke-width:18}50%{opacity:1;stroke-width:23}}@keyframes geneRungGlow{0%,to{filter:brightness(1)}50%{filter:brightness(1.28)}}@keyframes geneLabelGlow{0%,to{opacity:.82}50%{opacity:1}}@media(max-width:600px){.lesson-card:has(.scene-one.active) .scene-one .cell-shape{top:-13%;right:-22%;bottom:-13%;left:-22%}.lesson-card:has(.scene-one.active) .scene-one .nucleus{width:min(82vw,350px);height:73vh;border-width:9px}.lesson-card:has(.scene-one.active) .scene-one .nucleus-label{top:8%;font-size:.68rem}.lesson-card:has(.scene-one.active) .scene-one .dna-helix{top:13%;width:210px;height:74%}.lesson-card:has(.scene-one.active) .scene-one .helix-rail{width:45px;border-width:9px}.lesson-card:has(.scene-one.active) .scene-one .helix-rail-left{left:22px}.lesson-card:has(.scene-one.active) .scene-one .helix-rail-right{right:22px}.lesson-card:has(.scene-one.active) .scene-one .helix-rung{left:35px;width:140px;height:11px}.lesson-card:has(.scene-one.active) .scene-one .gene-highlight{left:calc(50% + 132px)}.lesson-card:has(.scene-one.active) .scene-one .gene-highlight:before{left:-88px;width:76px}.lesson-card:has(.scene-one.active) .scene-one .gene-highlight:after{font-size:.72rem}.lesson-card:has(.scene-one.active) .lesson-content{bottom:88px;width:calc(100% - 34px)}.lesson-card:has(.scene-one.active) .step-description{font-size:.9rem}.lesson-card:has(.scene-one.active) .lesson-controls{right:16px;bottom:20px}.lesson-card:has(.scene-one.active) .next-button{min-width:126px;min-height:47px;font-size:.68rem}}.lesson-card:has(.scene-one.active) .scene-one:not([data-three-unavailable]) .step-one-3d-canvas{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;display:block;width:100%;height:100%;pointer-events:none}.lesson-card:has(.scene-one.active) .scene-one:not([data-three-unavailable]) .cell-shape{top:0;right:0;bottom:0;left:0;z-index:1;overflow:visible;border:0!important;border-radius:0;background:transparent!important;box-shadow:none!important;transform:none!important;animation:none!important}.lesson-card:has(.scene-one.active) .scene-one:not([data-three-unavailable]) .cell-shape:before,.lesson-card:has(.scene-one.active) .scene-one:not([data-three-unavailable]) .cell-shape:after,.lesson-card:has(.scene-one.active) .scene-one:not([data-three-unavailable]) .nucleus:before,.lesson-card:has(.scene-one.active) .scene-one:not([data-three-unavailable]) .nucleus:after{display:none}.lesson-card:has(.scene-one.active) .scene-one:not([data-three-unavailable]) .nucleus{top:0;right:0;bottom:0;left:0;z-index:1;width:100%;height:100%;min-width:0;border:0!important;border-radius:0;background:transparent!important;box-shadow:none!important;transform:none;animation:none}.lesson-card:has(.scene-one.active) .scene-one:not([data-three-unavailable]) .dna-helix,.lesson-card:has(.scene-one.active) .scene-one:not([data-three-unavailable]) .nucleus-label,.lesson-card:has(.scene-one.active) .scene-one:not([data-three-unavailable]) .dna-label,.lesson-card:has(.scene-one.active) .scene-one:not([data-three-unavailable]) .gene-highlight{display:none!important}.lesson-card:has(.scene-one.active) .scene-one:not([data-three-unavailable]) .step-one-annotations{position:absolute;top:0;right:0;bottom:0;left:0;z-index:4;pointer-events:none;color:#fff8fff0;font-size:clamp(.68rem,1vw,.84rem);font-weight:700;letter-spacing:.03em;text-shadow:0 2px 9px rgba(6,2,34,.82)}.lesson-card:has(.scene-one.active) .scene-one:not([data-three-unavailable]) .scene-annotation{position:absolute;white-space:nowrap;transform:translateY(-50%);font-size:26px;font-weight:700;text-shadow:0 2px 6px rgba(0,0,0,.5)}.lesson-card:has(.scene-one.active) .scene-one:not([data-three-unavailable]) .annotation-line{position:absolute;height:2px;border-radius:99px;background:#fff7ffb8;box-shadow:0 0 7px #cda6ff8a;transform-origin:0 50%}.lesson-card:has(.scene-one.active) .scene-one:not([data-three-unavailable]) .gene-annotation{color:#ffe9a9}.lesson-card:has(.scene-one.active) .scene-one:not([data-three-unavailable]) .gene-annotation-line{background:#ffc45a;box-shadow:0 0 7px #ff9a2db8}.lesson-card:has(.scene-one.active) .scene-one[data-three-unavailable] .step-one-3d-canvas,.lesson-card:has(.scene-one.active) .scene-one[data-three-unavailable] .step-one-annotations{display:none}.lesson-card:has(.scene-one.active) .scene-one[data-three-unavailable] .nucleus-label{top:14%;left:auto;right:12%;color:#ffefffe6}.lesson-card:has(.scene-one.active) .scene-one[data-three-unavailable] .dna-label{position:absolute;top:18%;left:13%;z-index:5;display:block;color:#fff8fff0;font-size:clamp(.68rem,1vw,.84rem);font-weight:700;text-shadow:0 2px 9px rgba(6,2,34,.82)}.lesson-card:has(.scene-one.active) .scene-one[data-three-unavailable] .dna-label:after{position:absolute;top:50%;left:calc(100% + 10px);width:56px;height:2px;content:"";border-radius:99px;background:#fff7ffb8;box-shadow:0 0 7px #cda6ff8a;transform:rotate(18deg);transform-origin:0 50%}.lesson-card:has(.scene-one.active) .scene-one[data-three-unavailable] .dna-helix{top:19%;width:182px;height:65%}.lesson-card:has(.scene-one.active) .scene-one[data-three-unavailable] .helix-rail-left{border-color:#2aa1d8;border-top-color:transparent;border-bottom-color:transparent;background:linear-gradient(90deg,#147aa9 0,#44c9ee 45%,#a8efff 68%,#238ebd)}.lesson-card:has(.scene-one.active) .scene-one[data-three-unavailable] .helix-rail-right{border-color:#39c8f5;border-top-color:transparent;border-bottom-color:transparent;background:linear-gradient(90deg,#1c8fc0 0,#55d9f5 42%,#b3f3ff 68%,#238ab9)}.lesson-card:has(.scene-one.active) .scene-one[data-three-unavailable] .helix-rung:not(.gene-rung){background:linear-gradient(180deg,#b9f4ff 0,#5fcce9 46%,#248bb9)}.lesson-card:has(.scene-one.active) .scene-one[data-three-unavailable] .strand-cyan{stroke:#39c8f5}.lesson-card:has(.scene-one.active) .scene-one[data-three-unavailable] .strand-purple{stroke:#2aa1d8}.lesson-card:has(.scene-two.active){position:fixed;top:0;right:0;bottom:0;left:0;width:100vw;height:100vh;max-width:none;margin:0;padding:0;border-radius:0;overflow:hidden;background:radial-gradient(circle at 50% 42%,rgba(102,76,207,.42),transparent 38%),radial-gradient(circle at 15% 20%,rgba(33,145,224,.4),transparent 32%),linear-gradient(145deg,#0d2b64,#10245d 48%,#07183f)}.lesson-card:has(.scene-two.active) .scene-two{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;margin:0;padding:0;border-radius:0;overflow:hidden;background:radial-gradient(circle at 50% 42%,rgba(102,76,207,.42),transparent 38%),radial-gradient(circle at 15% 20%,rgba(33,145,224,.4),transparent 32%),linear-gradient(145deg,#0d2b64,#10245d 48%,#07183f)}.lesson-card:has(.scene-two.active) .scene-two canvas{position:absolute;top:0;right:0;bottom:0;left:0;display:block;width:100%!important;height:100%!important}.lesson-card:has(.scene-two.active) #progress-label,.lesson-card:has(.scene-two.active) #progress-fill{display:none}.lesson-card:has(.scene-two.active) #step-description{position:fixed;left:50%;bottom:82px;z-index:20;width:min(850px,80vw);margin:0;transform:translate(-50%);color:#fff7fff0;font-size:clamp(.95rem,1.8vw,1.18rem);font-weight:500;line-height:1.4;text-align:center;text-shadow:0 2px 10px rgba(4,3,36,.7)}.lesson-card:has(.scene-two.active) #next-button{position:fixed;right:56px;bottom:33px;z-index:30;width:136px;min-height:49px;margin:0;border:none;border-radius:32px;background:linear-gradient(135deg,#218df7,#4e60e6);color:#fff;font-size:12px;font-weight:700;letter-spacing:.08em;box-shadow:0 8px 20px #00000038}.lesson-card:has(.scene-two.active) #back-button{position:fixed;left:56px;bottom:33px;z-index:30;width:136px;min-height:49px;margin:0;border:2px solid rgba(255,255,255,.45);border-radius:32px;background:#ffffff1f;color:#fff;font-size:12px;font-weight:700;letter-spacing:.06em;box-shadow:none}.lesson-card:has(.scene-two.active) .scene-two-label{z-index:15}.lesson-card:has(.scene-two.active) .visual-stage{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;margin:0;padding:0;border-radius:0;background:transparent}.scene-three{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;overflow:hidden}.scene-three canvas{display:block;width:100%;height:100%}.scene-three-label,.scene-three-label-line{pointer-events:none}.lesson-card:has(.scene-three.active){position:fixed;top:0;right:0;bottom:0;left:0;width:100vw;height:100vh;max-width:none;margin:0;padding:0;border-radius:0;overflow:hidden;background:radial-gradient(circle at 50% 42%,rgba(102,76,207,.42),transparent 38%),radial-gradient(circle at 15% 20%,rgba(33,145,224,.4),transparent 32%),linear-gradient(145deg,#0d2b64,#10245d 48%,#07183f)}.lesson-card:has(.scene-three.active) .visual-stage{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;min-height:0;margin:0;padding:0;border-radius:0;background:transparent}.lesson-card:has(.scene-three.active) .scene-three{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;margin:0;padding:0;border-radius:0;overflow:hidden;background:radial-gradient(circle at 50% 42%,rgba(102,76,207,.42),transparent 38%),radial-gradient(circle at 15% 20%,rgba(33,145,224,.4),transparent 32%),linear-gradient(145deg,#0d2b64,#10245d 48%,#07183f)}.lesson-card:has(.scene-three.active) .scene-three canvas{position:absolute;top:0;right:0;bottom:0;left:0;display:block;width:100%!important;height:100%!important}.lesson-card:has(.scene-three.active) .lesson-content{display:none}.lesson-card:has(.scene-three.active) .progress-row{display:none}.lesson-card:has(.scene-three.active) #back-button{position:fixed;left:56px;bottom:33px;z-index:30;width:136px;min-height:49px;margin:0;border:2px solid rgba(255,255,255,.45);border-radius:32px;background:#ffffff1f;color:#fff;font-size:12px;font-weight:700;letter-spacing:.06em;box-shadow:none}.lesson-card:has(.scene-three.active) #next-button{position:fixed;right:56px;bottom:33px;z-index:30;width:136px;min-height:49px;margin:0;border:none;border-radius:32px;background:linear-gradient(135deg,#218df7,#4e60e6);color:#fff;font-size:12px;font-weight:700;letter-spacing:.08em;box-shadow:0 8px 20px #00000038}.lesson-card:has(.scene-three.active) .scene-three-label{z-index:15}.lesson-card:has(.scene-three.active) .scene-three-label-line{z-index:14}.scene-three-description{display:none;position:fixed;left:50%;bottom:82px;z-index:1000;width:min(850px,80vw);margin:0;padding:0;transform:translate(-50%);color:#fff7fff0;font-size:clamp(.95rem,1.8vw,1.18rem);font-weight:500;line-height:1.4;text-align:center;text-shadow:0 2px 10px rgba(4,3,36,.7);pointer-events:none}.visual-stage:has(.scene-three.active) .scene-three-description{display:block}.lesson-card:has(.scene-three.active) .scene-three-label-line.mrna-line{position:absolute!important;height:2px!important;border:none!important;border-top:none!important;border-bottom:none!important;border-radius:0!important;background:#ffc21a!important;box-shadow:none!important}.scene-four{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;overflow:hidden;background:transparent}.translation-scene{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;overflow:hidden}.translation-mrna{position:absolute;left:18%;top:50%;width:64%;height:80px;transform:translateY(-50%);z-index:20}.mrna-strand{position:absolute;left:0;right:0;top:38px;height:9px;border-radius:999px;background:#fff21a;box-shadow:0 0 4px #ffd20040}.mrna-strand i{position:relative;display:inline-block;width:4.5%;height:24px;margin-right:.5%;top:-19px;border-radius:3px 3px 0 0;background:#fff21a}.mrna-label{position:absolute;left:7%;top:-2px;color:#ffc21a;font-family:Arial,Helvetica,sans-serif;font-size:clamp(18px,2vw,28px);font-weight:700;text-shadow:0 2px 6px rgba(0,0,0,.45)}.translation-ribosome{position:absolute;left:50%;top:51%;width:310px;height:250px;transform:translate(-50%,-50%);z-index:10}.ribosome-large{position:absolute;left:50%;top:0;width:300px;height:125px;transform:translate(-50%);border-radius:50%;background:linear-gradient(to bottom,#78e0ae,#68d59e 55%,#3e9c70)}.ribosome-small{position:absolute;left:50%;bottom:0;width:275px;height:110px;transform:translate(-50%);border-radius:50%;background:linear-gradient(to bottom,#78e0ae,#68d59e 55%,#3e9c70)}.translation-trna{position:absolute;width:110px;height:210px;z-index:30}.trna-one{left:40%;top:31%}.trna-two{left:49%;top:27%}.trna-three{left:58%;top:31%}.trna-shape{position:absolute;left:50%;top:62px;width:70px;height:130px;transform:translate(-50%)}.trna-stem{position:absolute;left:50%;top:15px;width:18px;height:105px;transform:translate(-50%);border-radius:999px;background:linear-gradient(to right,#c8b0ff,#9d7bea)}.trna-arm-left{position:absolute;left:3px;top:25px;width:55px;height:18px;border-radius:999px;background:#b49af5;transform:rotate(12deg)}.trna-arm-right{position:absolute;right:3px;top:65px;width:55px;height:18px;border-radius:999px;background:#b49af5;transform:rotate(-12deg)}.trna-two .trna-stem,.trna-two .trna-arm-left,.trna-two .trna-arm-right{background:#8fe7f5}.trna-three .trna-stem,.trna-three .trna-arm-left,.trna-three .trna-arm-right{background:#f0a6d2}.amino-acid{position:absolute;left:50%;top:0;width:42px;height:42px;transform:translate(-50%);border-radius:50%;background:linear-gradient(145deg,#ffbd72,#ff914d);box-shadow:inset -5px -6px 10px #be501e33,0 2px 8px #0000002e;z-index:35}.amino-acid-chain{position:absolute;left:50%;top:10%;width:95px;height:260px;transform:translate(-50%);z-index:40}.chain-amino{position:absolute;width:43px;height:43px;border-radius:50%;background:linear-gradient(145deg,#ffbd72,#ff914d);box-shadow:inset -5px -6px 10px #be501e33,0 2px 8px #0000002e}.chain-one{left:24px;top:0}.chain-two{left:38px;top:48px}.chain-three{left:18px;top:96px}.chain-four{left:35px;top:144px}.chain-five{left:18px;top:192px}.chain-amino:after{content:"";position:absolute;width:10px;height:28px;left:16px;top:35px;border-radius:999px;background:#ffad62}.chain-five:after{display:none}.amino-acid-three:after{content:"";position:absolute;left:19px;top:38px;width:7px;height:55px;border-radius:999px;background:#ffad62}.translation-label{position:absolute;z-index:60;color:#fff;font-family:Arial,Helvetica,sans-serif;font-size:clamp(18px,2vw,26px);font-weight:700;white-space:nowrap;text-shadow:0 2px 6px rgba(0,0,0,.5)}.translation-mrna-label{left:25%;top:39%;color:#ffc21a}.translation-trna-label{left:34%;top:70%}.translation-ribosome-label{left:54%;top:67%}.translation-chain-label{left:61%;top:20%;font-size:clamp(15px,1.5vw,21px)}.lesson-card:has(.scene-four.active) .lesson-content{display:none}.lesson-card:has(.scene-four.active) .progress-row{display:none}.lesson-card:has(.scene-four.active){position:fixed;top:0;right:0;bottom:0;left:0;width:100vw;height:100vh;max-width:none;margin:0;padding:0;border-radius:0;overflow:hidden;background:radial-gradient(circle at 50% 42%,rgba(102,76,207,.42),transparent 38%),radial-gradient(circle at 15% 20%,rgba(33,145,224,.4),transparent 32%),linear-gradient(145deg,#0d2b64,#10245d 48%,#07183f)}.lesson-card:has(.scene-four.active) .visual-stage{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;min-height:0;margin:0;padding:0;border-radius:0;background:transparent}.lesson-card:has(.scene-four.active) .scene-four{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.lesson-card:has(.scene-four.active) #back-button{position:fixed;left:56px;bottom:33px;z-index:100;width:136px;min-height:49px;margin:0;border:2px solid rgba(255,255,255,.45);border-radius:32px;background:#ffffff1f;color:#fff;font-size:12px;font-weight:700;letter-spacing:.06em;box-shadow:none}.lesson-card:has(.scene-four.active) #next-button{position:fixed;right:56px;bottom:33px;z-index:100;width:136px;min-height:49px;margin:0;border:none;border-radius:32px;background:linear-gradient(135deg,#218df7,#4e60e6);color:#fff;font-size:12px;font-weight:700;letter-spacing:.08em;box-shadow:0 8px 20px #00000038}.scene-four .trna{position:absolute;z-index:20;width:82px;height:150px;transform:translate(-50%);background:transparent;border:none;box-shadow:none;display:block}.scene-four .trna:before{content:"";position:absolute;left:34px;top:28px;width:14px;height:82px;border-radius:10px;background:#a985f5;box-shadow:inset 2px 2px 4px #ffffff47,inset -3px -3px 5px #0000002e}.scene-four .trna:after{content:"";position:absolute;left:5px;top:43px;width:72px;height:15px;border-radius:10px;background:#a985f5;box-shadow:inset 2px 2px 4px #ffffff47,inset -3px -3px 5px #0000002e}.scene-four .trna-loop{position:absolute;left:27px;bottom:5px;width:30px;height:42px;border-radius:0 0 15px 15px;background:transparent;border-left:10px solid #a985f5;border-right:10px solid #a985f5;border-bottom:10px solid #a985f5;box-sizing:border-box}.scene-four .amino-acid{position:absolute;left:50%;top:-10px;transform:translate(-50%);width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#ffad4d;color:transparent;font-size:0;box-shadow:inset 3px 3px 5px #ffffff59,inset -4px -4px 6px #0000002e}.scene-four .trna-a{left:39%;top:28%}.scene-four .trna-b{left:50%;top:25%}.scene-four .trna-c{left:61%;top:28%}.scene-four .trna-a:before,.scene-four .trna-a:after{background:#a985f5}.scene-four .trna-a .trna-loop{border-left-color:#a985f5;border-right-color:#a985f5;border-bottom-color:#a985f5}.scene-four .trna-b:before,.scene-four .trna-b:after{background:#82d7f5}.scene-four .trna-b .trna-loop{border-left-color:#82d7f5;border-right-color:#82d7f5;border-bottom-color:#82d7f5}.scene-four .trna-c:before,.scene-four .trna-c:after{background:#ee8fc4}.scene-four .trna-c .trna-loop{border-left-color:#ee8fc4;border-right-color:#ee8fc4;border-bottom-color:#ee8fc4}.scene-four-description{position:fixed;left:50%;bottom:105px;transform:translate(-50%);width:min(850px,80vw);text-align:center;color:#fff;font-family:Arial,Helvetica,sans-serif;font-size:18px;line-height:1.5;text-shadow:0 2px 6px rgba(0,0,0,.45);z-index:1000;pointer-events:none}.lesson-card:has(.scene-five.active){position:fixed;top:0;right:0;bottom:0;left:0;width:100vw;height:100vh;max-width:none;margin:0;padding:0;border-radius:0;overflow:hidden;background:radial-gradient(circle at 50% 42%,rgba(102,76,207,.42),transparent 38%),radial-gradient(circle at 15% 20%,rgba(33,145,224,.4),transparent 32%),linear-gradient(145deg,#0d2b64,#10245d 48%,#07183f)}.lesson-card:has(.scene-five.active) .visual-stage{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;min-height:0;margin:0;padding:0;background:transparent}.lesson-card:has(.scene-five.active) .scene-five{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;margin:0;padding:0;overflow:hidden;background:transparent}.lesson-card:has(.scene-five.active) .scene-five canvas{position:absolute;top:0;right:0;bottom:0;left:0;display:block;width:100%!important;height:100%!important}.lesson-card:has(.scene-five.active) .lesson-content,.lesson-card:has(.scene-five.active) .progress-row{display:none}.lesson-card:has(.scene-five.active) #back-button{position:fixed;left:56px;bottom:33px;z-index:100;width:136px;min-height:49px;margin:0;border:2px solid rgba(255,255,255,.45);border-radius:32px;background:#ffffff1f;color:#fff;font-size:12px;font-weight:700;letter-spacing:.06em;box-shadow:none}.lesson-card:has(.scene-five.active) #next-button{display:none!important}.lesson-card:has(.scene-five.active) #replay-button{display:inline-flex!important;align-items:center;justify-content:center;gap:8px;position:fixed;right:56px;bottom:33px;z-index:1000;width:136px;min-height:49px;margin:0;padding:0 18px;border:none;border-radius:32px;background:linear-gradient(135deg,#218df7,#4e60e6);color:#fff;font-size:12px;font-weight:700;letter-spacing:.08em;box-shadow:0 8px 20px #00000038;cursor:pointer}.lesson-card:has(.scene-five.active) .scene-five-description{position:fixed;left:50%;bottom:100px;transform:translate(-50%);width:min(800px,calc(100% - 48px));margin:0;text-align:center;color:#fff;font-family:inherit;font-size:16px;font-weight:500;line-height:1.6;z-index:50}.scene-six{position:relative;width:100%;min-height:620px;overflow:hidden}#scene-six-3d-container{width:100%;height:700px;min-height:620px}