*,:before,:after{box-sizing:border-box}html,body{overscroll-behavior:none;width:100%;height:100%;margin:0;overflow:hidden}body,button{font-family:Microsoft YaHei,PingFang SC,Noto Sans CJK SC,system-ui,sans-serif}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0;padding:0}button:disabled{cursor:default}img{-webkit-user-select:none;user-select:none;-webkit-user-drag:none;max-width:100%;display:block}h1,h2,h3,p{margin:0}[hidden]{display:none!important}button:focus-visible,[tabindex]:focus-visible{outline-offset:4px;outline:4px solid #23a8ff}.sr-only{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;padding:0;position:absolute;overflow:hidden}:root{color:#123581;font-synthesis:none;background:#192347}body{-webkit-user-select:none;user-select:none}.app-viewport{background:radial-gradient(#743966,#192347 76%);position:fixed;inset:0;overflow:hidden}.scene{--theme-color:#ff5dae;--theme-glow:#ff77c980;width:1600px;height:900px;transform:translate(-50%, -50%) scale(var(--scene-scale,.7));transform-origin:50%;isolation:isolate;position:absolute;top:50%;left:50%;overflow:hidden}.scene-backdrop{z-index:-2;background:url(../assets/ui/stage-background-clean.webp) 50%/cover no-repeat;position:absolute;inset:0}.scene-backdrop:after{content:"";background:linear-gradient(#ffdfee00 15%,#ffcbed1c 50%,#ffdeed15);position:absolute;inset:0}.show-header{z-index:3;text-align:center;width:836px;height:164px;position:absolute;top:16px;left:382px}.title-crown{color:#ffd77e;text-shadow:0 2px 1px #914014,0 0 14px #fff4c6;width:100%;font-size:47px;line-height:1;position:absolute;top:-13px;left:0}.show-header h1{letter-spacing:1px;color:#fff7c8;-webkit-text-stroke:2px #ffc286;paint-order:stroke fill;text-shadow:0 5px #e74671,0 9px #ae1649,-5px 0 #bd1655,5px 0 #bd1655,0 -5px #bd1655,0 0 14px #fff2dd,0 10px 24px #740b6d;padding-top:29px;font-size:73px;font-weight:1000;line-height:1.12;position:relative}.show-ribbon{color:#362074;background:linear-gradient(#fffbe9,#ffe8bc 51%,#ffe1b0);border:2px solid #fff8ea;border-radius:8px 8px 25px 25px;justify-content:center;align-items:center;gap:20px;min-width:605px;height:47px;margin-top:9px;padding:0 27px;font-size:23px;font-weight:800;display:inline-flex;box-shadow:0 4px #d38c7b,0 0 16px #ffecdf7d}.show-ribbon span{color:#e6348e;text-shadow:0 1px #fff;font-size:27px}.guest-pool{z-index:5;background:linear-gradient(145deg,#fffdfef8,#eef7fffa 70%,#fffffffa);border:4px solid #ffe3b1;border-radius:55px 55px 28px 28px/30px 30px 28px 28px;width:458px;height:548px;padding:19px 17px 12px;transition:filter .28s,box-shadow .28s;position:absolute;top:177px;box-shadow:inset 0 0 0 3px #fff,inset 0 0 0 6px #f6cf91,0 0 0 2px #f5ae87,0 0 22px #fff4d39c,0 10px 22px #7e32684d}.cation-pool{left:24px}.anion-pool{right:24px}.pool-heading{text-align:center;height:83px}.pool-title{white-space:nowrap;justify-content:center;align-items:center;gap:12px;display:flex}.pool-title h2{letter-spacing:1px;color:#bb155a;font-size:34px;font-weight:900}.anion-pool .pool-title h2{color:#153eaf}.pool-crown{color:#e9a531;text-shadow:0 2px #fff7ca,0 -1px #ffe8ac;font-size:46px;line-height:1}.pool-type{color:#42619c;background:#e9effa;border:1px solid #d7e2f4;border-radius:8px;padding:4px 8px;font-size:14px}.pool-heading p{color:#3561b8;margin-top:6px;font-size:17px;line-height:1.4}.pool-footer{color:#6c7e9f;justify-content:space-between;align-items:end;height:29px;padding:0 5px;font-size:14px;display:flex}.pool-status{color:#5574b4}.is-locked .pool-status{color:#8791a5}.guest-pool.is-locked{filter:brightness(.9)saturate(.8)}.mode-selector{z-index:8;grid-template-columns:repeat(4,1fr);align-items:center;gap:10px;height:109px;display:grid;position:absolute;top:749px;left:194px;right:194px}.mode-button{border-radius:48px;height:90px;transition:transform .16s,filter .2s;position:relative}.mode-button img{pointer-events:none;width:354px;max-width:none;height:auto;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.mode-button:hover:not(:disabled){filter:brightness(1.08);transform:translateY(-4px)scale(1.025)}.mode-button:active:not(:disabled){transform:translateY(0)scale(.97)}.mode-button.is-selected{filter:brightness(1.1)drop-shadow(0 0 11px #fffbe6);transform:translateY(-5px)}.mode-button.is-selected:after{content:"已选择";color:#70448b;background:#fff4fa;border:1px solid #f4cde5;border-radius:12px;padding:2px 13px;font-size:13px;font-weight:800;position:absolute;bottom:-13px;left:50%;transform:translate(-50%);box-shadow:0 2px 6px #b8498524}.mode-button:disabled{filter:saturate(.7)}.flow-guide{color:#183f9e;white-space:nowrap;background:#fff4fae0;border:1px solid #fff;border-radius:20px;justify-content:center;align-items:center;gap:25px;width:800px;height:31px;font-size:16px;display:flex;position:absolute;top:862px;left:50%;transform:translate(-50%);box-shadow:0 0 12px #fdf4ff80}.flow-guide strong{font-size:15px}.flow-guide span{align-items:center;gap:8px;display:flex}.flow-guide b{color:#fff;background:#2454b8;border-radius:50%;place-items:center;width:21px;height:21px;font-size:14px;display:grid}.asset-error{color:#a22638;z-index:300;background:#fff2f2;border:1px solid #ffbcc5;border-radius:10px;padding:12px 20px;font-size:14px;position:fixed;bottom:12px;left:50%;transform:translate(-50%);box-shadow:0 5px 20px #0003}.stage-lights{z-index:-1;pointer-events:none;opacity:0;mix-blend-mode:screen;transition:opacity .65s;position:absolute;inset:0;overflow:hidden}.scene.is-music-playing .stage-lights{opacity:.85}.spotlight{--light-rgb:255 221 175;left:calc(var(--light-x) - 150px);top:var(--light-y);transform-origin:50% 0;width:300px;height:800px;transform:rotate(var(--sweep-from));animation:spotlight-sweep var(--sweep-duration,3s) ease-in-out var(--sweep-delay,0s) infinite alternate;will-change:transform;animation-play-state:paused;position:absolute}.spotlight:before{content:"";background:conic-gradient(from 165deg at 50% 0, transparent, rgb(var(--light-rgb) / .08) 3deg, rgb(var(--light-rgb) / .4) 12deg, rgb(var(--light-rgb) / .55) 15deg, rgb(var(--light-rgb) / .4) 18deg, rgb(var(--light-rgb) / .08) 27deg, transparent 30deg);filter:blur(7px);position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000 0%,#000b 35%,#0000 95%);mask-image:linear-gradient(#000 0%,#000b 35%,#0000 95%)}.spotlight-left{--light-x:343px;--light-y:27px;--sweep-from:-37deg;--sweep-to:10deg;--sweep-duration:2.8s}.spotlight-left-inner{--light-x:645px;--light-y:95px;--sweep-from:-23deg;--sweep-to:26deg;--sweep-duration:3.4s;--sweep-delay:-1.1s}.spotlight-blue{--light-x:595px;--light-y:10px;--light-rgb:120 210 255;--sweep-from:-30deg;--sweep-to:25deg;--sweep-duration:3.8s;--sweep-delay:-.7s}.spotlight-pink{--light-x:1060px;--light-y:64px;--light-rgb:255 137 227;--sweep-from:30deg;--sweep-to:-25deg;--sweep-duration:3.8s;--sweep-delay:-.7s}.spotlight-right-inner{--light-x:954px;--light-y:95px;--sweep-from:23deg;--sweep-to:-26deg;--sweep-duration:3.4s;--sweep-delay:-1.1s}.spotlight-right{--light-x:1254px;--light-y:27px;--sweep-from:37deg;--sweep-to:-10deg;--sweep-duration:2.8s}.scene.is-music-playing .spotlight{animation-play-state:running}@keyframes spotlight-sweep{0%{transform:rotate(var(--sweep-from))}to{transform:rotate(var(--sweep-to))}}@media (prefers-reduced-motion:reduce){.spotlight{will-change:auto;animation:none}.stage-lights{transition:none}.scene.is-music-playing .stage-lights{opacity:.35}}.center-stage{z-index:4;width:640px;height:530px;position:absolute;top:195px;left:480px}.stage-core{width:640px;height:447px;position:absolute;top:0;left:0}.heart-art{object-fit:contain;pointer-events:none;width:640px;height:447px;transition:filter .35s,opacity .35s;position:absolute;inset:0}.theme-copy{text-align:center;pointer-events:none;z-index:2;position:absolute;top:-5px;left:43px;right:43px}.theme-eyebrow{color:#ffe9b9;letter-spacing:6px;text-shadow:0 1px 5px #a12563;font-size:15px;font-weight:650;display:block}.theme-copy h2{letter-spacing:2px;color:#fff8ea;text-shadow:0 2px 2px #b32176,0 0 12px #ffdeec;margin-top:3px;font-size:36px;font-weight:850;line-height:1.25}.theme-copy p{color:#fff8ef;text-shadow:0 1px 4px #872552,0 1px 8px #872552;margin-top:7px;font-size:17px;line-height:1.35}.stage-slot{touch-action:none;z-index:3;border-radius:48% 48% 24% 24%;width:212px;height:214px;position:absolute;top:191px}.slot-a{left:83px}.slot-b{right:83px}.slot-placeholder{color:#fff;text-shadow:0 2px 12px #bc6ca1;pointer-events:none;background:radial-gradient(at 50% 28%,#fffaf3bb,#f8dfefaa 53%,#d7bbde88);border:2px dashed #fff3ccd0;border-radius:43% 43% 33% 33%;flex-direction:column;justify-content:center;align-items:center;transition:opacity .18s;display:flex;position:absolute;inset:12px 27px 39px;box-shadow:inset 0 0 16px #fff2d5aa,0 0 12px #ffeabe75}.slot-placeholder span{font-size:79px;font-weight:750;line-height:1.02}.slot-placeholder small{color:#fffaf4;margin-top:4px;font-size:14px}.slot-ring{opacity:0;height:33px;box-shadow:0 0 15px #fffccb, 0 0 30px var(--theme-color), inset 0 0 13px #fff2cb;pointer-events:none;border:3px solid #fff6c8;border-radius:50%;transition:opacity .15s,transform .15s;position:absolute;bottom:20px;left:17px;right:17px;transform:scale(.85)}.stage-slot.is-drop-target .slot-ring{opacity:1;transform:scale(1.1)}.stage-slot.is-drop-target .slot-placeholder{background:#fff5d8ce;box-shadow:0 0 24px #fff5c9}.stage-slot.is-drop-target{outline-offset:-7px;outline:2px solid #fff5b6ba}.slot-guest{cursor:grab;transition:transform .4s cubic-bezier(.2,.8,.25,1),opacity .2s;position:absolute;inset:-48px -15px 0}.stage-avatar{object-fit:contain;pointer-events:none;filter:drop-shadow(0 3px 3px #8d2f6570);width:242px;max-width:none;height:242px;position:absolute;top:0;left:0}.slot-symbol{text-align:center;color:#8f256c;background:linear-gradient(#fffaf5f7,#ffe6eef2);border:1px solid #fff6d9;border-radius:18px;height:30px;font-size:22px;font-weight:850;line-height:28px;position:absolute;bottom:0;left:31px;right:31px;box-shadow:0 3px 8px #8e336834}.remove-guest{color:#ac4075;z-index:4;background:#fff6fbea;border:1px solid #ffdfee;border-radius:50%;width:28px;height:28px;font-size:25px;line-height:1;position:absolute;top:-10px;right:-1px;box-shadow:0 1px 6px #96225235}.remove-guest:hover{color:#ee237a;background:#fff}.stage-slot.is-dragging .slot-guest{opacity:.22}.stage-heart-mark{color:#fff1ed;text-shadow:0 0 6px #fff,0 0 16px #ff44af;pointer-events:none;font-size:59px;line-height:1;position:absolute;top:266px;left:50%;transform:translate(-50%)}.start-area{text-align:center;width:100%;position:absolute;top:424px;left:0}.start-button{vertical-align:top;border-radius:45px;width:306px;height:79px;position:relative}.start-disabled-art{pointer-events:none;width:369px;max-width:none;height:auto;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.start-active-art{color:#fff;background:linear-gradient(#ffafda 0%,#fb4aaa 35%,#d71379 76%,#ff82bc 100%);border:3px solid #fff4df;border-radius:44px;justify-content:center;align-items:center;gap:12px;display:none;position:absolute;inset:0;box-shadow:inset 0 0 0 2px #fcb9d7,inset 0 4px 8px #fff9,0 4px #b83874,0 0 21px #ff78c98c}.start-active-art span{text-shadow:0 2px 2px #a0226a;font-size:34px;font-weight:900}.start-active-art i{font-size:32px;font-style:normal;line-height:1}.start-button:not(:disabled) .start-disabled-art{display:none}.start-button:not(:disabled) .start-active-art,.start-button.is-submitting .start-active-art{display:flex}.start-button.is-submitting .start-disabled-art{display:none}.start-button:not(:disabled):hover{filter:brightness(1.1)}.stage-hint{color:#ba1b68;background:#fff1f7ef;border:1px solid #fff9f7;border-radius:20px;max-width:565px;margin:12px auto 0;padding:4px 17px;font-size:17px;font-weight:700;line-height:1.25;display:table;box-shadow:0 2px 8px #862f5336}.pair-toast{z-index:10;white-space:nowrap;color:#a61a68;background:#fff8e9f5;border:1px solid #fff4be;border-radius:22px;padding:9px 21px;font-size:20px;font-weight:800;position:absolute;top:165px;left:50%;transform:translate(-50%);box-shadow:0 0 23px #fff3c5}.pair-conditions{z-index:2;color:#82205d;text-align:center;background:#fff0f3e6;border:1px solid #ffeeda;border-radius:18px;padding:5px 9px;font-size:14px;font-weight:650;line-height:1.25;position:absolute;top:107px;left:45px;right:45px}.ion-grid{grid-template-columns:repeat(4,minmax(0,1fr));align-content:start;gap:8px;height:390px;display:grid}.cation-grid{grid-template-rows:repeat(3,minmax(0,1fr))}.anion-grid{grid-template-rows:repeat(4,minmax(0,1fr))}.ion-card{touch-action:none;-webkit-tap-highlight-color:transparent;cursor:grab;background:linear-gradient(135deg,#fff9fc,#edf4fc);border:1px solid #d7e3f1;border-radius:11px;width:100%;min-width:0;height:100%;min-height:0;transition:background .18s,border-color .18s,box-shadow .18s;position:relative;overflow:visible}.ion-image{object-fit:contain;transform-origin:50% 85%;pointer-events:none;width:106%;max-width:none;height:calc(100% - 17px);transition:transform .16s,filter .18s,opacity .16s;position:absolute;top:-4%;left:-3%}.cation-grid .ion-image{width:116%;left:-8%}.ion-symbol{color:#102d8b;text-align:center;white-space:nowrap;pointer-events:none;font-size:21px;font-weight:800;line-height:1.2;position:absolute;bottom:5px;left:1px;right:1px}.anion-grid .ion-symbol{font-size:18px;bottom:3px}.ion-lock{color:#7e8ea8;filter:drop-shadow(0 1px 1px #7481a53d);pointer-events:none;background:#f9fbffe6;border-radius:5px;width:21px;height:24px;padding:2px;position:absolute;bottom:29px;right:4px}.anion-grid .ion-lock{bottom:24px}.ion-card:not(:disabled):hover{z-index:1;background:linear-gradient(135deg,#fff,#e7f2ff);border-color:#99c2ff;box-shadow:0 0 15px #6dc1ff52}.ion-card:not(:disabled):hover .ion-image{filter:drop-shadow(0 0 6px #75c6ff85);transform:translateY(-4px)scale(1.055)}.ion-card.is-pressed .ion-image{transform:scale(.96)}.ion-card.is-locked{cursor:not-allowed}.ion-card.is-locked .ion-image{filter:brightness(.7)saturate(.7);opacity:.69}.ion-card.is-locked .ion-symbol{color:#71809d}.ion-card.is-on-stage .ion-image{opacity:.28;filter:saturate(.7)}.ion-card.is-on-stage{background:#e6edf7;border-style:dashed}.ion-seat{color:#b53b86;pointer-events:none;background:#fff3fbea;border:1px solid #f0cae3;border-radius:6px;padding:2px 5px;font-size:12px;position:absolute;top:4px;right:4px}.ion-card.is-dragging .ion-image{opacity:.19;filter:none;transform:none}.drag-layer{pointer-events:none;z-index:200;position:fixed;inset:0;overflow:hidden}.drag-avatar{will-change:transform;transform-origin:50%;filter:drop-shadow(0 7px 10px #812c6b50)drop-shadow(0 0 8px #ffe4fd80);pointer-events:none;object-fit:contain;max-width:none;position:absolute;top:0;left:0}.drag-avatar.is-returning{opacity:.2;transition:transform .25s cubic-bezier(.2,.85,.3,1),width .25s,height .25s,opacity .25s}body.is-dragging,body.is-dragging *{cursor:grabbing!important}.guest-pool.is-return-target{box-shadow:inset 0 0 0 3px #fff,inset 0 0 0 6px #f6cf91,0 0 0 4px #fff7d4,0 0 25px #ffe074}.theme-precipitation{--theme-color:#72cfff;--theme-glow:#67caff75}.theme-gas{--theme-color:#63f1d2;--theme-glow:#61e8c96e}.theme-weak-electrolyte{--theme-color:#ffb974;--theme-glow:#ffb76e70}.theme-redox{--theme-color:#c295ff;--theme-glow:#b078ff85}.scene:not(.theme-waiting) .heart-art{filter:drop-shadow(0 0 12px var(--theme-glow))}.scene:not(.theme-waiting) .theme-eyebrow{color:var(--theme-color);text-shadow:0 1px 3px #79245b,0 0 8px #fff5e633}.start-button:not(:disabled){animation:2.4s ease-in-out infinite ready-breathe}@keyframes ready-breathe{0%,to{filter:drop-shadow(0 0 5px #ff71b5a0);transform:scale(1)}50%{filter:drop-shadow(0 0 14px #ff7fcac4);transform:scale(1.025)}}.scene.is-pairing .guest-pool{filter:brightness(.78)saturate(.8)}.scene.is-pairing .heart-art{filter:brightness(1.12)drop-shadow(0 0 18px #ffcff0);animation:.85s ease-out heart-flash}.scene.is-pairing .slot-a .slot-guest{transform:translate(24px)rotate(3deg)}.scene.is-pairing .slot-b .slot-guest{transform:translate(-24px)rotate(-3deg)}.scene.is-pairing .stage-heart-mark{transform:translate(-50%)scale(1.16)}.scene.is-pairing .remove-guest{visibility:hidden}@keyframes heart-flash{0%{opacity:1}35%{opacity:.5;filter:brightness(1.55)}70%,to{opacity:1}}.slot-guest.is-arriving{animation:.3s cubic-bezier(.2,.9,.4,1.2) arrive}@keyframes arrive{0%{opacity:.7;transform:translateY(-12px)scale(.91)}to{opacity:1;transform:translateY(0)scale(1)}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.result-overlay{z-index:250;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#132c47e8;position:fixed;inset:0;overflow:hidden}.result-scene{width:1600px;height:900px;transform:translate(-50%, -50%) scale(var(--scene-scale,.7));transform-origin:50%;color:#163859;border-radius:10px;position:absolute;top:50%;left:50%;overflow:hidden;box-shadow:0 18px 90px #061c3540;outline:none!important}.result-content{background:#e9f3fa;animation:.4s ease-out both result-enter;position:absolute;inset:0}.reaction-background{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.reaction-illustration{width:1098px;height:900px;position:absolute;top:0;left:0;overflow:hidden}.reaction-scene-heading{z-index:5;align-items:center;gap:24px;display:flex;position:absolute;top:45px;left:85px;right:65px}.reaction-theme{color:#327fc6;background:#eff9fff2;border:2px solid #fff;border-radius:30px;justify-content:center;align-items:center;height:52px;padding:0 28px;font-size:26px;font-weight:800;display:inline-flex;box-shadow:0 4px 18px #a3c8e75c}.reaction-scene-heading h2{letter-spacing:2px;color:#294f71;text-shadow:0 1px 10px #fff;font-size:29px;font-weight:700}.reaction-character{z-index:3;will-change:transform;margin:0;position:absolute}.reaction-character img{object-fit:contain;width:100%;height:100%}.reaction-cation{width:435px;height:435px;top:240px;left:153px}.reaction-anion{width:396px;height:396px;top:274px;left:548px}.reaction-character figcaption{text-align:center;color:#23557b;background:#f2fbffe8;border:1px solid #fffd;border-radius:50px;min-width:148px;padding:5px 22px 7px;font-size:35px;font-weight:800;line-height:1.1;position:absolute;bottom:-3px;left:50%;transform:translate(-50%);box-shadow:0 4px 20px #4c7fa721}.reaction-precipitate{z-index:2;object-fit:contain;transform-origin:50% 100%;will-change:opacity, transform;width:680px;height:340px;position:absolute;top:402px;left:215px}.reaction-hearts{z-index:4;color:#f4a0ad;text-shadow:0 2px 8px #fff;width:132px;height:96px;position:absolute;top:275px;left:523px}.reaction-hearts span{font-size:40px;position:absolute}.reaction-hearts span:first-child{top:18px;left:37px;transform:rotate(-14deg)}.reaction-hearts span:nth-child(2){font-size:24px;top:4px;left:90px;transform:rotate(18deg)}.reaction-hearts span:nth-child(3){font-size:23px;top:65px;left:4px;transform:rotate(-20deg)}.reaction-scene-note{color:#52728c;letter-spacing:1px;text-shadow:0 1px 4px #fff;font-size:17px;position:absolute;bottom:24px;left:38px}.reaction-panel{background:linear-gradient(145deg,#fffffff5,#f8fcfff5);border:2px solid #fff;border-radius:30px;flex-direction:column;gap:22px;width:478px;height:852px;padding:30px 26px 24px;display:flex;position:absolute;top:24px;left:1098px;box-shadow:0 10px 34px #315f8d22}.result-close{color:#7b9bb7;background:#eaf2fa;border-radius:50%;width:38px;height:38px;font-size:30px;line-height:1;position:absolute;top:12px;right:14px}.result-close:hover{color:#2478cc;background:#dceeff}.reaction-panel-heading{flex:none}.result-eyebrow{color:#8ba3b9;letter-spacing:1.8px;margin-bottom:10px;padding-top:5px;font-size:12px}.reaction-panel-heading h2{color:#12365e;letter-spacing:1px;font-size:40px;font-weight:900;line-height:1.2}.result-badge{color:#4d89b9;letter-spacing:1px;background:#eaf4fc;border-radius:24px;margin-top:15px;padding:6px 16px;font-size:17px;font-weight:700;display:inline-block}.reaction-information{background:#fff;border:1px solid #e5eef7;border-radius:24px;flex-direction:column;flex:1;justify-content:space-between;min-height:0;padding:20px 22px;display:flex;box-shadow:0 5px 16px #315f8d08}.reaction-detail h3{color:#668aa9;align-items:center;gap:10px;margin-bottom:9px;font-size:19px;font-weight:700;line-height:1.3;display:flex}.reaction-detail h3 span{color:#f29bad;text-align:center;width:24px;font-size:26px;line-height:1}.reaction-detail h3 svg{fill:#d6edff;stroke:#5c9ce1;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:24px;height:24px}.pair-detail p{letter-spacing:2px;color:#173e6a;padding-left:34px;font-size:37px;font-weight:800;line-height:1.2}.declaration-detail p{white-space:pre-line;color:#304f72;padding-left:34px;font-size:20px;font-weight:600;line-height:1.65}.equation-detail p{color:#143b66;white-space:nowrap;font-size:26px;font-weight:700;line-height:1.4}.phenomenon-detail h3 span{color:#efbf57}.phenomenon-detail p{color:#153c67;padding-left:34px;font-size:28px;font-weight:800;line-height:1.3}.phenomenon-detail small{color:#8a9fb3;margin-top:6px;padding-left:34px;font-size:15px;display:block}.reaction-controls{flex:none}.reaction-play{color:#fff;background:linear-gradient(110deg,#2584ef,#42a7f4);border-radius:32px;justify-content:center;align-items:center;gap:14px;width:100%;height:62px;font-size:25px;font-weight:700;transition:filter .15s,transform .15s;display:flex;box-shadow:0 7px 15px #368feb35}.reaction-play svg{fill:currentColor;width:26px;height:26px}.reaction-play:hover{filter:brightness(1.05);transform:translateY(-1px)}.reaction-play:active{transform:scale(.98)}.reaction-progress-track{background:#e4eef7;border-radius:5px;height:3px;margin:12px 14px 0;overflow:hidden}.reaction-progress-track span{transform-origin:0;background:#68b3f1;width:100%;height:100%;display:block}.reaction-status{text-align:center;color:#8aa2b9;margin-top:7px;font-size:14px;line-height:22px}.reaction-return-actions{gap:12px;margin-top:13px;display:flex}.reaction-return-actions button{color:#658aaa;background:#f8fbff;border:1px solid #d5e5f4;border-radius:23px;justify-content:center;align-items:center;gap:8px;width:50%;height:44px;font-size:18px;font-weight:600;display:flex}.reaction-return-actions button:hover{color:#317bbd;background:#edf6ff;border-color:#a5c9eb}.reaction-return-actions span{font-size:27px;line-height:1}.reaction-return-actions svg{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:20px;height:20px}@keyframes result-enter{0%{opacity:0;transform:scale(.97)}to{opacity:1;transform:scale(1)}}@media (prefers-reduced-motion:reduce){.result-content{animation-duration:.01ms}}.reaction-water-effects{z-index:1;pointer-events:none;border-radius:48% 48% 46% 46%/6%;width:947px;height:454px;position:absolute;top:292px;left:96px;overflow:hidden}.reaction-solution{mix-blend-mode:multiply;position:absolute;inset:0}.reaction-bubbles{position:absolute;inset:0 55px 12px}.reaction-bubbles span{background:radial-gradient(circle at 28% 24%,#ffffffd9 0 7%,#ffffff0d 20% 64%,#c5e9ff77 76%,#faffffbb 90%,#0000);border:1px solid #ffffffd9;border-radius:50%;position:absolute;bottom:0;box-shadow:inset -2px -3px 5px #c1e2edbb,0 0 3px #fff8}.result-scene[data-layout=standard] .reaction-cation{width:330px;height:330px;top:329px;left:232px}.result-scene[data-layout=standard] .reaction-anion{width:330px;height:330px;top:329px;left:572px}.result-scene[data-layout=standard] .reaction-hearts{top:312px;left:512px}.result-scene[data-layout=standard] .reaction-character figcaption{bottom:-22px}.reaction-observation{z-index:6;text-align:center;color:#2d658a;background:#f9fdffed;border:1px solid #fff;border-radius:28px;width:704px;min-height:44px;padding:8px 15px;font-size:24px;font-weight:750;position:absolute;top:772px;left:218px;box-shadow:0 4px 14px #4f799715}.reaction-detail-note{z-index:6;text-align:center;color:#52718a;text-shadow:0 1px 4px #fff;max-height:40px;font-size:15px;line-height:1.35;position:absolute;bottom:30px;left:125px;right:65px}.reaction-scene-note{font-size:12px;bottom:9px;left:38px}.reaction-panel{gap:17px;padding-top:27px}.reaction-information{padding:16px 18px}.reaction-detail h3{margin-bottom:6px}.declaration-detail p{font-size:18px;line-height:1.45}.equation-detail #result-equation{white-space:pre-line;overflow-wrap:anywhere;font-size:24px;line-height:1.45}.equation-detail #result-equation.is-long{font-size:21px}.equation-detail .result-condition{white-space:normal;color:#648ca9;margin-top:6px;font-size:13px;font-weight:500;line-height:1.4}.phenomenon-detail p{font-size:23px;line-height:1.3}.phenomenon-detail small{font-size:14px}.failure-overlay{z-index:260;-webkit-backdrop-filter:blur(6px);background:#201e3b99;place-items:center;padding:20px;display:grid;position:fixed;inset:0;overflow:hidden}.failure-dialog{text-align:center;color:#75376c;background:linear-gradient(145deg,#fffaf7,#fff1f7 53%,#f0f6ff);border:2px solid #fff4e5;border-radius:28px;width:min(650px,86vw);max-height:92vh;padding:28px 35px 30px;animation:.35s ease-out both result-enter;position:relative;box-shadow:0 20px 80px #21103455,inset 0 0 0 4px #ffffff8c;outline:none!important}.failure-close{color:#b36592;background:#fffafad9;border-radius:50%;width:35px;height:35px;font-size:29px;position:absolute;top:13px;right:15px}.failure-close:hover{color:#e33b88;background:#fff}.failure-mark{color:#d793b7;margin-top:8px;font-size:68px;font-weight:600;line-height:1}.failure-mark span{vertical-align:middle;color:#c1a1b7;margin:0 5px;font-size:28px;display:inline-block}.failure-eyebrow{letter-spacing:4px;color:#b583a3;margin:14px 0 7px;font-size:14px}.failure-dialog h2{letter-spacing:2px;color:#8c4272;font-size:clamp(24px,2.5vw,34px)}.failure-pair{color:#3a5681;background:#ffffffc9;border:1px solid #ecdde9;border-radius:16px;margin:19px 0 16px;padding:12px 32px;font-size:31px;font-weight:800;display:inline-block}#failure-message{font-size:18px;line-height:1.65}.failure-suggestion{color:#5689b1;margin-top:12px;font-size:16px;line-height:1.5}.failure-footnote{color:#a58ca3;margin-top:16px;font-size:13px}.failure-return{color:#fff;background:linear-gradient(120deg,#e877ab,#d4599e);border:2px solid #fff9;border-radius:28px;min-width:270px;height:52px;margin:22px auto 0;padding:0 25px;font-size:19px;font-weight:700;display:block;box-shadow:0 6px 16px #ce639a2b}.failure-return:hover{filter:brightness(1.05)}@media (height<=600px){.failure-dialog{padding:17px 24px}.failure-mark{font-size:43px}.failure-pair{margin:9px 0;padding:5px 20px}.failure-return{margin-top:12px}}@media (prefers-reduced-motion:reduce){.failure-dialog{animation-duration:.01ms}}.reaction-detail-canvas{z-index:3;pointer-events:none;width:1098px;height:900px;position:absolute;inset:0}.reaction-cloud{z-index:2;object-fit:contain;transform-origin:50%;will-change:transform, opacity;width:540px;height:270px;position:absolute;top:315px;left:125px}.reaction-chapters{z-index:8;background:#ffffffb8;border:1px solid #ffffffea;border-radius:30px;align-items:center;gap:7px;width:971px;height:56px;padding:6px;display:flex;position:absolute;top:124px;left:59px;box-shadow:0 6px 30px #718ea70c}.reaction-chapters button{color:#7893a8;border-radius:24px;flex:1;height:42px;font-size:18px;font-weight:650;transition:background .15s,color .15s}.reaction-chapters button b{background:#e7f0f7;border-radius:50%;place-items:center;width:26px;height:26px;margin-right:9px;font-size:14px;display:inline-grid}.reaction-chapters button[aria-current=step]{color:#337ab0;background:#fff;box-shadow:0 3px 12px #759bbf19}.reaction-chapters button[aria-current=step] b{color:#fff;background:#70afd9}.reaction-chapters button:hover{color:#327eb9;background:#fff}.result-scene[data-detailed=true] .reaction-scene-heading{gap:20px;left:59px;right:68px}.result-scene[data-detailed=true] .reaction-scene-heading h2{letter-spacing:1px;font-size:28px}.result-scene[data-detailed=true] .reaction-theme{height:48px;padding-inline:23px;font-size:24px}.result-scene[data-detailed=true] .reaction-water-effects{display:none}.result-scene[data-detailed=true] .reaction-precipitate{width:572px;height:286px;top:453px;left:107px}.reaction-couple-card{z-index:3;text-align:center;color:#9d7e97;background:linear-gradient(140deg,#fffffff2,#fff6fbeb);border:1.5px solid #fff;border-radius:25px;width:326px;height:226px;padding-top:19px;font-size:19px;font-weight:700;position:absolute;top:517px;left:704px}.reaction-couple-card>span{color:#e4a5b8;margin-right:6px}.result-scene[data-detailed=true] .reaction-cation{z-index:4;width:179px;height:168px;top:555px;left:706px}.result-scene[data-detailed=true] .reaction-anion{z-index:4;width:170px;height:162px;top:563px;left:851px}.result-scene[data-detailed=true] .reaction-character figcaption{background:#fffffff0;min-width:88px;padding:3px 9px;font-size:19px;bottom:1px}.result-scene[data-detailed=true] .reaction-hearts{width:74px;height:60px;top:558px;left:844px}.result-scene[data-detailed=true] .reaction-hearts span:first-child{font-size:27px;top:0;left:14px}.result-scene[data-detailed=true] .reaction-hearts span:nth-child(2){font-size:18px;top:12px;left:53px}.result-scene[data-detailed=true] .reaction-hearts span:nth-child(3){font-size:16px;top:34px;left:0}.result-scene[data-detailed=true] .reaction-observation{width:923px;min-height:45px;font-size:23px;top:771px;left:88px}.result-scene[data-detailed=true] .reaction-detail-note{max-height:36px;font-size:14px;line-height:1.5;bottom:39px;left:76px;right:67px}.result-scene[data-detailed=true] .reaction-scene-note{bottom:13px;left:75px}.reaction-play-actions{align-items:center;gap:10px;display:flex}.reaction-play-actions .reaction-play{flex:1}.reaction-pause{color:#6c96b5;background:#f0f7fc;border:1px solid #d4e5f2;border-radius:31px;flex:0 0 86px;height:62px;font-size:20px;font-weight:700}.reaction-pause:disabled{opacity:.45;cursor:default}.reaction-pause:not(:disabled):hover{color:#397bab;background:#e1effa}.result-scene[data-detailed=true] .reaction-status{min-height:39px;font-size:13px;line-height:19px}.result-scene[data-detailed=true] .reaction-information{padding-block:15px}.result-scene[data-detailed=true] .declaration-detail p{font-size:17px}@media (prefers-reduced-motion:reduce){.reaction-chapters button{transition:none}}.sound-dock{z-index:22;gap:9px;display:flex;position:absolute;top:55px;right:35px}.sound-dock button{color:#986079;background:#fffbf1e8;border:1px solid #ffefd3a8;border-radius:22px;justify-content:center;align-items:center;gap:7px;height:40px;padding:0 14px;font-size:15px;font-weight:700;display:flex;box-shadow:0 4px 15px #2e12392b}.sound-dock button:hover{background:#fff}.sound-dock button:disabled{opacity:.5;cursor:default}.fullscreen-icon{flex-shrink:0;width:20px;height:20px}.fullscreen-notice{z-index:500;color:#986079;background:#fff9fb;border:1px solid #f4cde5;border-radius:16px;max-width:calc(100vw - 32px);padding:10px 18px;font-size:14px;position:fixed;bottom:20px;left:50%;transform:translate(-50%);box-shadow:0 4px 15px #2e12392b}.sound-dock .sound-icon{font-size:24px;line-height:1}.sound-dock .is-muted .sound-icon{opacity:.5;text-decoration:line-through}.sound-dock[data-surface=success],.sound-dock[data-surface=failure]{gap:7px;top:35px;right:90px}.sound-dock[data-surface=failure]{top:14px;right:63px}.sound-dock:not([data-surface=stage]) button{color:#78a1bd;width:32px;height:32px;box-shadow:none;background:#f2f7fc;border-color:#dceaf5;padding:0}.sound-dock:not([data-surface=stage]) .sound-dock-label{display:none}.sound-dock:not([data-surface=stage]) .sound-icon{font-size:22px}.sound-overlay{z-index:400;-webkit-backdrop-filter:blur(7px);background:#19213e91;place-items:center;padding:16px;display:grid;position:fixed;inset:0;overflow:hidden}.sound-dialog{color:#375c7d;background:linear-gradient(135deg,#fff9fb,#f4faff 60%,#fff);border:2px solid #fff;border-radius:28px;outline:none;width:min(910px,100vw - 32px);padding:24px 28px 20px;position:relative;box-shadow:0 22px 90px #1221404d}.sound-header{justify-content:space-between;align-items:center;padding-right:43px;display:flex}.sound-header h2{color:#3a507d;font-size:29px}.sound-header p{color:#839aad;margin-top:4px;font-size:14px}.sound-close{color:#7b9bb4;background:#eaf2f8;border-radius:50%;width:35px;height:35px;font-size:29px;position:absolute;top:19px;right:20px}.sound-now{color:#ad809c;background:#fff0f5;border-radius:18px;padding:8px 14px;font-size:13px}.sound-volume-row{align-items:center;gap:15px;height:61px;font-size:17px;font-weight:650;display:flex}.sound-volume-row input{accent-color:#68a9d7;cursor:pointer;flex:1;min-width:90px}.sound-volume-row output{color:#809ab1;width:49px;font-size:15px}.sound-volume-row button{color:#6e94b1;background:#fff;border:1px solid #d8e7f3;border-radius:18px;height:34px;padding:0 16px;font-size:14px}.sound-track-list{gap:10px;display:grid}.sound-track{background:#ffffffeb;border:1px solid #e3edf5;border-radius:18px;padding:13px 16px;box-shadow:0 4px 18px #6d8ba909}.sound-track-heading{align-items:center;gap:11px;display:flex}.sound-track-icon{color:#68a3d0;background:#e9f4fc;border-radius:13px;flex:0 0 38px;place-items:center;width:38px;height:38px;font-size:24px;display:grid}.sound-track[data-cue=success] .sound-track-icon{color:#d690b3;background:#fff1f6}.sound-track[data-cue=failure] .sound-track-icon{color:#ab98c9;background:#f4f0fa}.sound-track-heading h3{color:#496787;font-size:18px}.sound-song{color:#9aaeba;margin-top:3px;font-size:12px}.sound-track-meta{text-overflow:ellipsis;white-space:nowrap;color:#8da3b4;max-width:282px;margin-left:auto;font-size:13px;overflow:hidden}.sound-track-actions{align-items:center;gap:9px;margin-top:10px;display:flex}.sound-track-actions button{color:#6999bb;background:#eef6fc;border-radius:16px;height:31px;padding:0 14px;font-size:13px}.sound-track-actions .sound-pick{color:#fff;background:#72add6}.sound-track-actions .sound-reset{color:#9aaab6;background:#f5f7fa}.sound-track-actions label{color:#8ba0b0;align-items:center;gap:5px;margin-left:6px;font-size:12px;display:flex}.sound-track-actions input[type=number]{color:#557e9c;width:72px;height:29px;font:inherit;-webkit-user-select:text;user-select:text;background:#fbfdff;border:1px solid #dce8f1;border-radius:7px;padding:3px 6px}.sound-dialog button:disabled,.sound-dialog input:disabled{opacity:.45;cursor:default}.sound-save-actions{gap:10px;margin-top:17px;display:flex}.sound-save-actions button{color:#7b9bb3;background:#fff;border:1px solid #d9e6f1;border-radius:20px;min-height:40px;padding:0 20px;font-size:14px}.sound-save-actions .sound-save-html{color:#fff;background:linear-gradient(100deg,#6babe0,#8abce2);border-color:#0000;margin-left:auto;font-weight:700}.sound-notice{color:#889eaf;min-height:37px;margin-top:13px;font-size:13px;line-height:1.55}@media (height<=700px){.sound-dialog{padding-block:17px}.sound-volume-row{height:47px}.sound-track{padding-block:9px}.sound-notice{margin-top:8px}}@media (width<=760px){.sound-track-meta{max-width:120px}.sound-song,.sound-now{display:none}.sound-track-actions{gap:5px}.sound-track-actions button{padding-inline:8px}.sound-track-actions label{margin-left:0}.sound-track-actions input[type=number]{width:53px}.sound-save-actions button{padding-inline:11px}}