.science-index-hero{padding:52px 0 18px;max-width:920px}
.science-index-hero h1,.science-hero h1{font-size:clamp(2.7rem,6vw,5.8rem);line-height:.92;letter-spacing:-.065em;margin:.35rem 0 .75rem}
.science-index-hero p,.science-hero p{max-width:760px;color:var(--muted);line-height:1.72}
.science-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:22px}
.science-card{display:grid;grid-template-columns:110px 1fr;gap:18px;align-items:center;text-decoration:none;color:inherit;background:var(--surface);border:1px solid var(--line);border-radius:24px;padding:16px;box-shadow:var(--shadow2);transition:transform .18s ease,border-color .18s ease}
.science-card:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--green) 38%,var(--line))}
.science-thumb{height:92px;border-radius:18px;overflow:hidden;background:linear-gradient(180deg,#f9fcfd,#ece4d8);position:relative}
.science-card h2{margin:0 0 5px;font-size:1.18rem}.science-card p{margin:0;color:var(--muted);font-size:.79rem;line-height:1.5}
.science-hero{padding:42px 0 18px}.science-layout{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(300px,.75fr);gap:18px}
.science-article,.science-visual-card{background:var(--surface);border:1px solid var(--line);border-radius:28px;box-shadow:var(--shadow2)}
.science-article{padding:28px}.science-article h2{font-size:1.45rem;margin:26px 0 8px;letter-spacing:-.025em}.science-article p{color:var(--muted);line-height:1.78;margin:0 0 13px}
.science-memory{margin-top:24px;padding:18px 19px;border-radius:18px;background:color-mix(in srgb,var(--green) 7%,var(--surface));border:1px solid color-mix(in srgb,var(--green) 18%,var(--line));line-height:1.62}
.science-memory strong{display:block;margin-bottom:5px;color:var(--green)}
.science-visual-card{padding:16px;position:sticky;top:16px;align-self:start}.science-caption{font-size:.7rem;color:var(--muted);margin:10px 4px 2px}
.living-scene{position:relative;height:330px;overflow:hidden;border-radius:22px;border:1px solid var(--line);background:#fbfcfb}

/* Shared particles */
.dot{position:absolute;width:9px;height:9px;border-radius:50%;background:#4f8ca9;box-shadow:0 0 0 3px rgba(79,140,169,.08)}
@keyframes jig{from{transform:translate(-2px,-1px)}to{transform:translate(2px,2px)}}
@keyframes rise{0%{transform:translate(0,0);opacity:0}15%{opacity:.75}100%{transform:translate(var(--dx,0),-120px);opacity:0}}
/* evaporation */
.scene-evaporation{background:linear-gradient(#fbfcfb 0 52%,#b6d9e8 52% 100%)}
.scene-evaporation .liquid-label,.scene-condensation .liquid-label{position:absolute;left:14px;bottom:12px;color:white;font-size:.68rem;text-transform:uppercase;letter-spacing:.12em;font-weight:800}
.scene-evaporation .dot.base{bottom:50px;animation:jig 2.2s ease-in-out infinite alternate}
.scene-evaporation .dot.fly{bottom:158px;opacity:0;animation:rise 5.2s ease-out infinite}
.scene-evaporation .d1{left:18%}.scene-evaporation .d2{left:34%;animation-delay:.5s}.scene-evaporation .d3{left:51%;animation-delay:1s}.scene-evaporation .d4{left:68%;animation-delay:1.4s}.scene-evaporation .d5{left:82%;animation-delay:.8s}
.scene-evaporation .f1{left:30%;animation-delay:.3s;--dx:-8px}.scene-evaporation .f2{left:50%;animation-delay:2s;--dx:10px}.scene-evaporation .f3{left:70%;animation-delay:3.6s;--dx:-6px}
/* condensation */
.scene-condensation{background:linear-gradient(#f7fafb 0 66%,#e7eef0 66% 100%)}
.cold-panel{position:absolute;right:28px;top:26px;width:56px;height:245px;border-radius:18px;background:linear-gradient(90deg,#c9e4ee,#eff8fb);border:1px solid #b7d5df}
.scene-condensation .vap{animation:jig 2.4s ease-in-out infinite alternate}
.scene-condensation .v1{left:15%;top:29%}.scene-condensation .v2{left:29%;top:48%}.scene-condensation .v3{left:45%;top:34%}.scene-condensation .v4{left:58%;top:55%}
.drop{position:absolute;width:10px;height:14px;border-radius:60% 60% 65% 65%;background:#6aa9c6;right:42px;opacity:.75;animation:dropgrow 5s ease-in-out infinite}
.dr1{top:80px}.dr2{top:132px;animation-delay:1.5s}.dr3{top:188px;animation-delay:3s}@keyframes dropgrow{0%,100%{transform:scale(.55);opacity:.25}50%{transform:scale(1);opacity:.85}}
/* boiling */
.scene-boiling{background:linear-gradient(#fbfcfb 0 30%,#a9d5e7 30% 100%)}
.bubble{position:absolute;border:2px solid rgba(255,255,255,.78);border-radius:50%;bottom:18px;animation:bubble 4.6s ease-in infinite}
.b1{width:24px;height:24px;left:20%;animation-delay:.2s}.b2{width:35px;height:35px;left:47%;animation-delay:1.6s}.b3{width:18px;height:18px;left:72%;animation-delay:2.8s}.b4{width:28px;height:28px;left:61%;animation-delay:3.5s}
@keyframes bubble{0%{transform:translateY(0) scale(.55);opacity:0}15%{opacity:.9}100%{transform:translateY(-210px) scale(1.1);opacity:0}}
/* melting */
.scene-melting,.scene-freezing{background:linear-gradient(#fbfcfb 0 72%,#eee5d8 72% 100%)}
.ice{position:absolute;left:50%;bottom:58px;width:120px;height:110px;transform:translateX(-50%) rotate(-2deg);border-radius:18px 16px 22px 14px;background:linear-gradient(145deg,#eefaff,#9bcfe3);box-shadow:inset 12px 10px 20px rgba(255,255,255,.55);animation:iceMelt 8s ease-in-out infinite alternate}
.melt-puddle{position:absolute;left:50%;bottom:42px;width:170px;height:32px;transform:translateX(-50%);border-radius:50%;background:#72abc6;opacity:.55;animation:puddleGrow 8s ease-in-out infinite alternate}
@keyframes iceMelt{to{transform:translateX(-50%) rotate(-2deg) scale(.72) translateY(15px);border-radius:25px}}
@keyframes puddleGrow{from{transform:translateX(-50%) scale(.5);opacity:.25}to{transform:translateX(-50%) scale(1.15);opacity:.7}}
/* freezing */
.scene-freezing .melt-puddle{animation:puddleFreeze 8s ease-in-out infinite alternate}.scene-freezing .ice{animation:iceGrow 8s ease-in-out infinite alternate}
@keyframes puddleFreeze{from{transform:translateX(-50%) scale(1.15);opacity:.7}to{transform:translateX(-50%) scale(.5);opacity:.25}}
@keyframes iceGrow{from{transform:translateX(-50%) rotate(-2deg) scale(.72) translateY(15px);border-radius:25px}to{transform:translateX(-50%) rotate(-2deg) scale(1);border-radius:18px 16px 22px 14px}}
/* dissolution */
.scene-dissolution{background:linear-gradient(#fbfcfb 0 25%,#a9d4e5 25% 100%)}
.grain{position:absolute;width:12px;height:12px;background:#f8f8f3;border:1px solid #c6c8c5;transform:rotate(45deg);animation:dissolve 6s ease-in-out infinite}
.g1{left:34%;top:43%}.g2{left:49%;top:56%;animation-delay:1.3s}.g3{left:61%;top:39%;animation-delay:2.6s}.ion{position:absolute;width:7px;height:7px;border-radius:50%;background:#4d8cab;opacity:0;animation:ions 6s ease-out infinite}
.i1{left:43%;top:45%}.i2{left:52%;top:50%;animation-delay:1.2s}.i3{left:58%;top:57%;animation-delay:2.4s}@keyframes dissolve{0%,25%{transform:rotate(45deg) scale(1);opacity:1}75%,100%{transform:rotate(45deg) scale(.2);opacity:0}}@keyframes ions{30%{opacity:0}50%{opacity:.8}100%{transform:translate(var(--x,40px),var(--y,-50px));opacity:.15}}
.i1{--x:-80px;--y:-45px}.i2{--x:65px;--y:25px}.i3{--x:-20px;--y:70px}
/* diffusion */
.scene-diffusion{background:#f8faf9}.scene-diffusion:after{content:"";position:absolute;top:0;bottom:0;left:50%;width:1px;background:rgba(70,90,80,.12);animation:fadewall 8s infinite}
.a,.b{position:absolute;width:9px;height:9px;border-radius:50%;animation:mix 8s ease-in-out infinite alternate}.a{background:#4f8ca9}.b{background:#d08a72}
.a1{left:17%;top:28%;--tx:330px;--ty:40px}.a2{left:24%;top:52%;--tx:250px;--ty:-40px}.a3{left:30%;top:70%;--tx:180px;--ty:-90px}.b1{right:17%;top:32%;--tx:-330px;--ty:80px}.b2{right:26%;top:58%;--tx:-220px;--ty:-20px}.b3{right:31%;top:76%;--tx:-170px;--ty:-100px}@keyframes mix{to{transform:translate(var(--tx),var(--ty))}}@keyframes fadewall{50%,100%{opacity:0}}
/* crystallization */
.scene-crystallization{background:linear-gradient(#fbfcfb 0 30%,#b8d9e6 30% 100%)}.crystal{position:absolute;width:27px;height:27px;background:linear-gradient(135deg,#eefaff,#77aec6);clip-path:polygon(50% 0,100% 35%,82% 100%,18% 100%,0 35%);opacity:0;animation:crystal 8s ease-in-out infinite}.c1{left:35%;bottom:26px}.c2{left:47%;bottom:31px;animation-delay:1s}.c3{left:57%;bottom:25px;animation-delay:2s}.c4{left:44%;bottom:60px;animation-delay:3s}@keyframes crystal{0%,20%{opacity:0;transform:scale(.25)}55%,100%{opacity:.95;transform:scale(1)}}
/* photosynthesis */
.scene-photosynthesis{background:linear-gradient(160deg,#f8fbf6,#eef5ea)}.leaf{position:absolute;left:50%;top:84px;width:190px;height:120px;transform:translateX(-50%) rotate(-8deg);border-radius:100% 0 100% 0;background:linear-gradient(145deg,#75a86f,#3e7f58);box-shadow:inset 12px 10px 25px rgba(255,255,255,.12)}
.leaf:after{content:"";position:absolute;left:18px;top:66px;width:160px;height:2px;background:rgba(236,250,233,.55);transform:rotate(-30deg);transform-origin:left}
.sunray{position:absolute;left:24%;top:20px;width:3px;height:90px;background:linear-gradient(#e7b64d,transparent);transform:rotate(25deg);animation:ray 4s ease-in-out infinite}.r2{left:34%;animation-delay:1s}.r3{left:44%;animation-delay:2s}
.gas{position:absolute;padding:7px 9px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.8);font-size:.72rem;font-weight:800}.co2{left:20px;bottom:65px}.h2o{left:50%;bottom:18px;transform:translateX(-50%)}.o2{right:20px;top:62px}.sugar{right:20px;bottom:48px}.flow{position:absolute;color:var(--green);font-weight:900;opacity:.5}.fl1{left:105px;bottom:84px}.fl2{right:105px;top:86px}.fl3{right:112px;bottom:73px}@keyframes ray{50%{opacity:.35;transform:rotate(25deg) translateY(8px)}}
/* water cycle */
.scene-water-cycle{background:linear-gradient(#dfeef6 0 58%,#c7d7b6 58% 73%,#75aac3 73% 100%)}.mountain{position:absolute;left:16%;bottom:88px;width:0;height:0;border-left:105px solid transparent;border-right:105px solid transparent;border-bottom:150px solid #8da08f}.mountain:after{content:"";position:absolute;left:-40px;top:55px;border-left:40px solid transparent;border-right:40px solid transparent;border-bottom:58px solid #eef4ef}
.cloud{position:absolute;right:13%;top:50px;width:130px;height:42px;border-radius:999px;background:#f7fafb;box-shadow:35px 8px 0 5px #f7fafb,-30px 12px 0 1px #f7fafb}.rain{position:absolute;right:17%;top:105px;width:2px;height:60px;background:repeating-linear-gradient(to bottom,#6fa7c1 0 7px,transparent 7px 14px);animation:rain 2s linear infinite}.rain.r2{right:23%;animation-delay:.6s}.rain.r3{right:29%;animation-delay:1.2s}.evap{position:absolute;right:12%;bottom:70px;color:white;font-size:1.45rem;animation:up 3s ease-in-out infinite}.runoff{position:absolute;left:43%;bottom:78px;width:100px;height:5px;background:#6ea9c6;border-radius:99px;transform:rotate(20deg)}.infil{position:absolute;left:36%;bottom:16px;color:#4d7b66;font-size:1.25rem;animation:down 3s ease-in-out infinite}@keyframes rain{to{background-position:0 14px}}@keyframes up{50%{transform:translateY(-12px);opacity:.5}}@keyframes down{50%{transform:translateY(9px);opacity:.45}}
@media(max-width:820px){.science-layout{grid-template-columns:1fr}.science-visual-card{position:relative;top:auto;order:-1}.science-grid{grid-template-columns:1fr}}
@media(max-width:560px){.science-article{padding:20px}.science-visual-card{padding:12px}.living-scene{height:270px}.science-card{grid-template-columns:82px 1fr}.science-thumb{height:75px}}
@media(prefers-reduced-motion:reduce){.living-scene *{animation:none!important}}

/* V4.2 water cycle — deliberately simple and readable */
.scene-water-cycle-v42{background:linear-gradient(#eaf5f8 0 68%,#d9e6c9 68% 78%,#76adc6 78% 100%)}
.wc-sun{position:absolute;left:28px;top:25px;width:48px;height:48px;border-radius:50%;background:#e8bb59;opacity:.9}
.wc-cloud{position:absolute;right:92px;top:48px;width:105px;height:34px;border-radius:999px;background:#fff}
.wc-cloud:before,.wc-cloud:after{content:"";position:absolute;border-radius:50%;background:#fff}.wc-cloud:before{width:48px;height:48px;left:18px;top:-21px}.wc-cloud:after{width:58px;height:58px;right:12px;top:-28px}
.wc-rain{position:absolute;top:95px;width:2px;height:68px;background:repeating-linear-gradient(to bottom,#69a5bf 0 8px,transparent 8px 15px);animation:rain42 2s linear infinite}.wc-rain.r1{right:125px}.wc-rain.r2{right:165px;animation-delay:.7s}
.wc-land{position:absolute;left:0;right:42%;bottom:22%;height:10%;background:#b9cf9d;border-radius:50% 55% 0 0}.wc-land span{position:absolute;right:18%;top:-28px;width:34px;height:42px;background:#6c9f66;border-radius:60% 40% 55% 45%}
.wc-river{position:absolute;left:39%;bottom:19%;width:30%;height:7px;background:#6fa8c1;transform:rotate(8deg);border-radius:999px}
.wc-ocean{position:absolute;left:58%;right:0;bottom:0;height:23%;background:#6fa8c1}.wc-ocean:before{content:"";position:absolute;left:0;right:0;top:-5px;height:10px;border-radius:50%;background:#9cc9da}
.wc-evap,.wc-transp,.wc-infil{position:absolute;color:#397b67;font-size:1.5rem;font-weight:800;animation:wcup 3s ease-in-out infinite}.wc-evap{right:22%;bottom:24%}.wc-transp{left:33%;bottom:31%}.wc-infil{left:24%;bottom:8%;animation:wcdown 3s ease-in-out infinite}
.wc-label{position:absolute;font-size:.62rem;color:var(--muted);font-weight:700}.wc-label.evap{right:15%;bottom:43%}.wc-label.rain{right:29%;top:165px}.wc-label.runoff{left:50%;bottom:25%}
@keyframes rain42{to{background-position:0 15px}}@keyframes wcup{50%{transform:translateY(-10px);opacity:.45}}@keyframes wcdown{50%{transform:translateY(9px);opacity:.45}}

/* V4.2.2 living diagrams */
.scene-surface-tension{background:linear-gradient(#fafcfc 0 48%,#a8d1e2 48% 100%)}
.scene-surface-tension .surface{position:absolute;left:0;right:0;top:48%;height:3px;background:#4f91af}
.scene-surface-tension .clip{position:absolute;left:50%;top:43%;width:92px;height:28px;border:3px solid #6d7472;border-radius:50%;transform:translateX(-50%);animation:gentlebob 4s ease-in-out infinite}
.scene-surface-tension .dip{position:absolute;left:50%;top:47%;width:115px;height:18px;border-radius:50%;border-bottom:3px solid rgba(79,145,175,.8);transform:translateX(-50%)}
@keyframes gentlebob{50%{transform:translateX(-50%) translateY(3px)}}
.scene-capillary{background:#fbfcfb}
.scene-capillary .bath{position:absolute;left:0;right:0;bottom:0;height:30%;background:#a8d1e2}
.scene-capillary .tube{position:absolute;left:50%;bottom:22%;width:58px;height:210px;border:3px solid #aab3b0;border-top:0;transform:translateX(-50%);background:linear-gradient(to top,#7bb5cf 0 62%,transparent 62%);animation:caprise 7s ease-in-out infinite alternate}
.scene-capillary .tube:after{content:"";position:absolute;left:-3px;right:-3px;top:35%;height:12px;border-radius:50%;border-top:3px solid #5e9db9}
@keyframes caprise{to{background:linear-gradient(to top,#7bb5cf 0 78%,transparent 78%)}}
.scene-corrosion{background:linear-gradient(#f7faf9 0 70%,#e6ece8 70% 100%)}
.scene-corrosion .iron{position:absolute;left:50%;bottom:60px;width:230px;height:65px;border-radius:10px;background:linear-gradient(180deg,#9aa3a1,#707a77);transform:translateX(-50%)}
.scene-corrosion .rust{position:absolute;left:50%;bottom:60px;width:230px;height:65px;border-radius:10px;transform:translateX(-50%);background:radial-gradient(circle at 20% 30%,#9d5f3a 0 7%,transparent 8%),radial-gradient(circle at 70% 60%,#b56d3f 0 12%,transparent 13%),radial-gradient(circle at 48% 34%,#8f5434 0 9%,transparent 10%);opacity:.15;animation:rustgrow 8s ease-in-out infinite alternate}
.scene-corrosion .drop{right:auto;width:9px;height:14px;left:35%;top:52px}.scene-corrosion .drop.d2{left:60%;top:75px}
@keyframes rustgrow{to{opacity:.88}}
.scene-acid-base{background:#fafcfb;display:flex;align-items:center;justify-content:center;gap:28px}
.scene-acid-base .beaker{position:relative;width:100px;height:130px;border:3px solid #aeb6b3;border-top:0;border-radius:0 0 18px 18px;overflow:hidden}
.scene-acid-base .liq{position:absolute;left:0;right:0;bottom:0;height:70%;background:#e4a6a4;animation:phshift 8s ease-in-out infinite alternate}
.scene-acid-base .plus{font-size:2rem;color:var(--muted)}
.scene-acid-base .beaker.base .liq{background:#a8cbe3}
@keyframes phshift{to{filter:saturate(.55) brightness(1.08)}}

/* V4.2.3 — water cycle: fewer symbols, stronger reading order */
.water-cycle-simple{position:relative;min-height:310px;overflow:hidden;border-radius:22px;background:linear-gradient(#dceff6 0 64%,#c9dfb8 64% 72%,#75b8d4 72%);border:1px solid var(--line)}
.wc-sun{position:absolute;left:30px;top:25px;font-size:54px}
.wc-cloud{position:absolute;right:45px;top:42px;font-size:72px;color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.12)}
.wc-water{position:absolute;left:0;right:42%;bottom:0;height:28%;background:linear-gradient(#73b9d6,#4b9abd)}
.wc-ground{position:absolute;right:0;bottom:0;width:45%;height:28%;background:#98b978;clip-path:polygon(0 48%,30% 25%,55% 45%,100% 0,100% 100%,0 100%)}
.wc-up,.wc-down{position:absolute;font-size:58px;font-weight:300;line-height:1;color:#3987a8;animation:wcfloat 2.8s ease-in-out infinite}
.wc-up{left:31%;bottom:72px}.wc-down{right:25%;top:110px;color:#4b91ad;animation-delay:.8s}
.wc-up span,.wc-down span{display:inline-grid;place-items:center;width:25px;height:25px;border-radius:50%;font-size:13px;font-weight:800;background:#fff;color:var(--ink);vertical-align:middle}
@keyframes wcfloat{50%{transform:translateY(-8px)}}
.cycle-steps{max-width:760px;margin:30px auto;padding:24px;border:1px solid var(--line);border-radius:20px;background:var(--paper)}
.cycle-steps p{line-height:1.65}

.science-extra{margin-top:18px;padding:22px 24px;background:var(--surface);border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow2)}
.science-extra h2{margin:0 0 8px;font-size:1.25rem}
.science-extra p{margin:0;color:var(--muted);line-height:1.72;max-width:840px}

/* V4.2.4 science diagrams */
.scene-osmosis{background:#f9fbfb}.scene-osmosis .mem{position:absolute;top:25px;bottom:25px;left:50%;width:4px;background:repeating-linear-gradient(to bottom,#7b8b85 0 9px,transparent 9px 16px)}.scene-osmosis .water-side{position:absolute;left:0;right:50%;bottom:0;height:58%;background:#acd5e5}.scene-osmosis .sol-side{position:absolute;left:50%;right:0;bottom:0;height:72%;background:#8fc3d8}.scene-osmosis .osm-arrow{position:absolute;left:40%;top:38%;font-size:42px;color:#367f9e;animation:osm 3s ease-in-out infinite}@keyframes osm{50%{transform:translateX(32px)}}
.scene-electrolysis{background:linear-gradient(#fbfcfb 0 24%,#abd5e5 24%)}.scene-electrolysis .electrode{position:absolute;top:44px;width:18px;height:220px;background:#596461;border-radius:5px}.scene-electrolysis .e1{left:29%}.scene-electrolysis .e2{right:29%}.scene-electrolysis .wire{position:absolute;left:29%;right:29%;top:34px;height:3px;background:#7d8582}.scene-electrolysis .battery{position:absolute;left:50%;top:18px;transform:translateX(-50%);padding:5px 10px;border:2px solid #7d8582;border-radius:8px;background:#fff}.scene-electrolysis .gasbubble{position:absolute;border:2px solid rgba(255,255,255,.9);border-radius:50%;bottom:24px;animation:gasup 3.6s linear infinite}.scene-electrolysis .g1{left:31%;width:15px;height:15px}.scene-electrolysis .g2{right:31%;width:20px;height:20px;animation-delay:1s}@keyframes gasup{to{transform:translateY(-150px);opacity:0}}
.scene-conduction{background:#fafbf9}.scene-conduction .bar{position:absolute;left:12%;right:12%;top:47%;height:34px;border-radius:18px;background:linear-gradient(90deg,#d68168,#e6ae7b,#9fc9d6)}.scene-conduction .heatdot{position:absolute;top:49%;width:10px;height:10px;border-radius:50%;background:#b95f4d;animation:heatmove 4s linear infinite}.scene-conduction .h1{left:20%}.scene-conduction .h2{left:28%;animation-delay:1s}.scene-conduction .h3{left:36%;animation-delay:2s}@keyframes heatmove{to{transform:translateX(300px);opacity:.25}}
.scene-convection{background:linear-gradient(#f9fbfb 0 20%,#acd5e5 20%)}.scene-convection .loop{position:absolute;left:50%;top:42%;width:160px;height:150px;transform:translate(-50%,-50%);border:4px solid rgba(62,129,157,.35);border-radius:50%}.scene-convection .up,.scene-convection .down{position:absolute;font-size:40px;font-weight:700}.scene-convection .up{left:35%;bottom:34%;color:#bc6656;animation:convup 3s ease-in-out infinite}.scene-convection .down{right:35%;top:30%;color:#4d90ad;animation:convdown 3s ease-in-out infinite}@keyframes convup{50%{transform:translateY(-20px)}}@keyframes convdown{50%{transform:translateY(20px)}}

/* V4.2.5 diagrams */
.scene-diffusion,.scene-surface,.scene-capillary,.scene-solubility{position:relative;overflow:hidden;background:#f7faf9}
.scene-diffusion i{position:absolute;width:12px;height:12px;border-radius:50%;background:#4f8f7d;animation:spread 5s ease-in-out infinite}.scene-diffusion i:nth-child(1){left:43%;top:40%}.scene-diffusion i:nth-child(2){left:47%;top:48%;animation-delay:.5s}.scene-diffusion i:nth-child(3){left:50%;top:38%;animation-delay:1s}.scene-diffusion i:nth-child(4){left:46%;top:58%;animation-delay:1.5s}.scene-diffusion i:nth-child(5){left:52%;top:53%;animation-delay:2s}@keyframes spread{50%,100%{transform:translate(calc((var(--x,1))*90px),calc((var(--y,1))*55px));opacity:.55}}
.scene-surface .water{position:absolute;left:0;right:0;bottom:0;height:52%;background:#acd5e5}.scene-surface .drop{position:absolute;left:50%;top:34%;width:92px;height:58px;transform:translateX(-50%);background:#79b9d3;border-radius:50% 50% 45% 45%}.scene-surface .skin{position:absolute;left:15%;right:15%;top:48%;height:3px;background:#397e9a;animation:skin 3s ease-in-out infinite}@keyframes skin{50%{transform:scaleX(.92)}}
.scene-capillary .pool{position:absolute;left:0;right:0;bottom:0;height:28%;background:#acd5e5}.scene-capillary .tube{position:absolute;left:50%;bottom:18%;width:58px;height:70%;transform:translateX(-50%);border:4px solid #82918c;border-top:0;border-radius:0 0 12px 12px}.scene-capillary .column{position:absolute;left:calc(50% - 25px);bottom:20%;width:50px;height:22%;background:#86c1d8;animation:rise 4s ease-in-out infinite}@keyframes rise{50%,100%{height:55%}}
.scene-solubility .glass{position:absolute;left:30%;right:30%;top:16%;bottom:12%;border:4px solid #87938f;border-top:0;border-radius:0 0 22px 22px}.scene-solubility .liquid{position:absolute;left:31%;right:31%;bottom:13%;height:48%;background:#afd8e7}.scene-solubility .grain{position:absolute;top:23%;left:48%;width:9px;height:9px;border-radius:50%;background:#b88458;animation:dissolve 4s linear infinite}.scene-solubility .g2{left:53%;animation-delay:1.3s}.scene-solubility .g3{left:43%;animation-delay:2.5s}@keyframes dissolve{70%{transform:translateY(110px) scale(.55);opacity:.55}100%{transform:translateY(140px) scale(.1);opacity:0}}

/* V4.4.2 electrolysis labels */
.scene-electrolysis .battery{min-width:118px;text-align:center;font-size:.72rem;font-weight:800;line-height:1.1;z-index:3}
.scene-electrolysis .electrode-label{position:absolute;top:72px;font-size:.66rem;font-weight:850;padding:4px 7px;background:rgba(255,255,255,.9);border-radius:999px;z-index:3;white-space:nowrap}
.scene-electrolysis .anode-label{left:15%}.scene-electrolysis .cathode-label{right:13%}
.scene-electrolysis .gas-label{position:absolute;bottom:46px;font-weight:850;color:#356d81;font-size:.82rem}
.scene-electrolysis .oxygen-label{left:25%}.scene-electrolysis .hydrogen-label{right:25%}
@media(max-width:600px){.scene-electrolysis .anode-label{left:5%}.scene-electrolysis .cathode-label{right:4%}.scene-electrolysis .battery{min-width:96px;font-size:.62rem}}

/* V4.4.2 photosynthesis readable diagram */
.scene-photosynthesis-v442{position:relative;min-height:300px;background:linear-gradient(180deg,#eaf6fb 0 55%,#e9f1df 55%);overflow:hidden;border-radius:18px}
.scene-photosynthesis-v442 .photo-sun{position:absolute;left:8%;top:10%;font-size:46px;animation:photoSun 3s ease-in-out infinite}
.scene-photosynthesis-v442 .photo-leaf{position:absolute;left:50%;top:45%;transform:translate(-50%,-50%);font-size:72px}
.scene-photosynthesis-v442 .photo-input,.scene-photosynthesis-v442 .photo-output{position:absolute;padding:8px 11px;border-radius:999px;background:#fff;border:1px solid rgba(0,0,0,.1);font-weight:850;box-shadow:0 4px 12px rgba(0,0,0,.07);z-index:2}
.scene-photosynthesis-v442 .co2{left:8%;top:48%}.scene-photosynthesis-v442 .h2o{left:15%;bottom:12%}
.scene-photosynthesis-v442 .sugar{right:7%;bottom:17%}.scene-photosynthesis-v442 .oxygen{right:10%;top:34%}
.scene-photosynthesis-v442 .photo-arrow{position:absolute;font-size:34px;color:#4f8a76;font-weight:900;animation:photoFlow 2s ease-in-out infinite}
.scene-photosynthesis-v442 .a1{left:31%;top:43%}.scene-photosynthesis-v442 .a2{right:27%;top:43%}
.scene-photosynthesis-v442 .photo-light{position:absolute;left:30%;top:13%;font-size:.76rem;font-weight:850;padding:5px 8px;border-radius:999px;background:rgba(255,255,255,.85)}
.photo-equation{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px;margin:20px 0;padding:18px 20px;border:1px solid var(--line);border-radius:20px;background:var(--surface);font-weight:850;font-size:clamp(1rem,3vw,1.35rem)}
.photo-equation span{padding:7px 10px;border-radius:12px;background:color-mix(in srgb,var(--green) 7%,var(--surface))}
@keyframes photoSun{50%{transform:scale(1.08)}} @keyframes photoFlow{50%{transform:translateX(8px);opacity:.45}}
@media(max-width:600px){.scene-photosynthesis-v442{min-height:270px}.scene-photosynthesis-v442 .photo-leaf{font-size:58px}.scene-photosynthesis-v442 .photo-input,.scene-photosynthesis-v442 .photo-output{font-size:.75rem}.scene-photosynthesis-v442 .photo-arrow{font-size:28px}}