:root{--bg-0:#070a0f;--bg-1:#0a1020;--surface:#ffffff0f;--surface-2:#ffffff14;--stroke:#ffffff24;--stroke-2:#ffffff38;--text:#eaf0ff;--muted:#eaf0ffb3;--ring:#7ae7ff;--ring-glow:#7ae7ff47;--focus:#7ae7ff;--focus-glow:#7ae7ff40;--sugar:#aeebff;--sugar-fill:#aeebff1a;--phos:#d57bff;--warn:#ff4d6d;--num-normal:#eaf0ff73;--highlight:#fff1b8;--r-lg:18px;--r-md:14px;--r-sm:12px;--ease:cubic-bezier(.2,.8,.2,1)}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg-0)}::-webkit-scrollbar-thumb{background:#fff3;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#fff6}*{box-sizing:border-box;-webkit-user-select:none;user-select:none;margin:0;padding:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Noto Sans TC,Arial,sans-serif}html{-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}html,body{min-height:100%}body{min-height:100dvh;color:var(--text);background:radial-gradient(900px 600px at 20% 20%, #7ae7ff1a, transparent 60%), radial-gradient(800px 500px at 80% 30%, #d57bff1a, transparent 60%), radial-gradient(900px 600px at 50% 80%, #ffc55a14, transparent 60%), linear-gradient(180deg, var(--bg-1), var(--bg-0));justify-content:center;align-items:center;padding:0;display:flex;overflow:hidden}body[data-ui-theme=light]{--bg-0:#c8b8a0;--bg-1:#e8dccd;--surface:#0f18281f;--surface-2:#0f18282e;--stroke:#0f18282e;--stroke-2:#0f182847;--text:#101b2b;--muted:#101b2bb8;--num-normal:#101b2b99;--highlight:#c98a1c;background:radial-gradient(1120px 740px at 16% 18%, #5fa4ba33, transparent 54%), radial-gradient(980px 720px at 82% 18%, #b884ab2b, transparent 56%), radial-gradient(980px 780px at 50% 86%, #cca04047, transparent 54%), linear-gradient(180deg, var(--bg-1), #d6c6b1 54%, var(--bg-0))}.floating-tools{top:calc(env(safe-area-inset-top,0px) + 16px);right:calc(env(safe-area-inset-right,0px) + 16px);z-index:140;align-items:center;gap:10px;display:flex;position:fixed}.page-dock{right:calc(env(safe-area-inset-right,0px) + 16px);bottom:calc(env(safe-area-inset-bottom,0px) + 16px);z-index:140;position:fixed}.language-switch{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:linear-gradient(#121828eb,#0a0e18d1);border:1px solid #ffffff1f;border-radius:999px;align-items:center;gap:4px;padding:4px;display:flex;box-shadow:0 14px 34px #00000052,0 0 18px #7ae7ff29}.page-switch{-webkit-backdrop-filter:blur(16px)saturate(.55);backdrop-filter:blur(16px)saturate(.55);background:linear-gradient(#0f1218f5,#080a0ee6);border:1px solid #ffffff29;border-radius:20px;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;min-width:170px;padding:6px;display:grid;box-shadow:0 18px 42px #00000057,inset 0 1px #ffffff0f}.language-btn{color:#eaf0ffb8;letter-spacing:.08em;cursor:pointer;min-width:54px;height:38px;transition:transform .18s var(--ease), background .18s var(--ease), color .18s var(--ease), box-shadow .18s var(--ease);-webkit-tap-highlight-color:transparent;background:0 0;border:none;border-radius:999px;place-items:center;padding:0 14px;font-size:12px;font-weight:900;display:grid}.page-link{cursor:pointer;color:#ffffff8f;letter-spacing:.14em;text-transform:uppercase;min-width:74px;height:40px;transition:transform .18s var(--ease), background .18s var(--ease), color .18s var(--ease), border-color .18s var(--ease), box-shadow .18s var(--ease);-webkit-tap-highlight-color:transparent;background:linear-gradient(#ffffff0a,#ffffff03);border:1px solid #ffffff14;border-radius:14px;place-items:center;padding:0 16px;font-size:11px;font-weight:900;text-decoration:none;display:grid}.page-link:hover{color:#ffffffe0;border-color:#ffffff29;transform:translateY(-1px)}.language-btn:hover{color:#fffffff5;transform:translateY(-1px)}.page-link:focus-visible{outline-offset:3px;outline:2px solid #ffffffad}.language-btn:focus-visible{outline:2px solid var(--highlight);outline-offset:3px}.page-link.is-active{color:#0b0e12;background:linear-gradient(#fffffffa,#dee2e8e0);border-color:#ffffffb8;box-shadow:0 10px 22px #0000004d,inset 0 1px #ffffffb8}.language-btn.is-active{color:#fffffffa;background:linear-gradient(#7ae7ff3d,#7ae7ff1a);box-shadow:inset 0 0 0 1px #7ae7ff47,0 8px 18px #0000002e}body[data-ui-theme=light] .language-switch{background:linear-gradient(#fffffff0,#f4eee5e0);border-color:#1422331f;box-shadow:0 14px 32px #946f302e,0 0 20px #ffd16624}body[data-ui-theme=light] .language-btn{color:#182437b8}body[data-ui-theme=light] .language-btn:hover{color:#0f1b2a}body[data-ui-theme=light] .language-btn.is-active{color:#0f1b2a;background:linear-gradient(#7ae7ff47,#7ae7ff1f);box-shadow:inset 0 0 0 1px #1c273a1a,0 8px 18px #946f3024}body[data-ui-theme=light] .page-switch{background:linear-gradient(#11141beb,#07090de0);border-color:#fff3;box-shadow:0 18px 36px #5f4a222e,inset 0 1px #ffffff0d}body[data-ui-theme=light] .page-link{color:#fff9}body[data-ui-theme=light] .page-link:hover{color:#ffffffe6}body[data-ui-theme=light] .page-link.is-active{color:#0b0e12;background:linear-gradient(#fffffffa,#e4e8ede6);border-color:#ffffffc2;box-shadow:0 10px 20px #0000003d,inset 0 1px #ffffffb8}.theme-toggle{cursor:pointer;color:#fff4c2f5;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);width:46px;height:46px;transition:transform .18s var(--ease), box-shadow .18s var(--ease), border-color .18s var(--ease), background .18s var(--ease), color .18s var(--ease);-webkit-tap-highlight-color:transparent;background:linear-gradient(#121828eb,#0a0e18d1);border:1px solid #ffffff1f;border-radius:999px;flex:none;place-items:center;display:grid;position:relative;box-shadow:0 14px 34px #00000052,0 0 22px #ffd16638}.theme-toggle:hover{border-color:#ffffff2e;transform:translateY(-1px);box-shadow:0 16px 38px #0000005c,0 0 28px #ffd16647}.theme-toggle:focus-visible{outline:2px solid var(--highlight);outline-offset:3px}.theme-toggle svg{width:22px;height:22px}.theme-toggle[data-theme=light]{color:#d78a00;background:linear-gradient(#fffffff0,#f4eee5e0);border:1px solid #1422331f;box-shadow:0 14px 32px #946f302e,0 0 20px #ffd16657}body[data-ui-theme=light] .theme-toggle{color:#d78a00;background:linear-gradient(#fffffff0,#f4eee5e0);border:1px solid #1422331f;box-shadow:0 14px 32px #946f302e,0 0 20px #ffd1664d}#app-shell{align-items:inherit;justify-content:inherit;width:100%;display:flex;position:relative}#particle-canvas{pointer-events:none;z-index:30;position:fixed;inset:0}.container{z-index:2;grid-template-columns:minmax(0,1fr) minmax(340px,430px);grid-template-areas:"stage controls";align-items:start;gap:24px;width:min(1200px,94vw);margin:0 auto;display:grid;position:relative}.stage-wrapper{flex-direction:column;grid-area:stage;align-items:center;gap:18px;min-width:0;display:flex}.stage{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);width:520px;height:520px;transition:transform .35s var(--ease);background:linear-gradient(#ffffff0f,#ffffff08);border:1px solid #ffffff1a;border-radius:999px;place-items:center;display:grid;position:relative;overflow:visible;box-shadow:0 24px 70px #00000073,inset 0 0 0 1px #ffffff0d}body[data-ui-theme=light] .stage{background:radial-gradient(circle at 30% 18%,#fff7ec66,#0000 32%),radial-gradient(circle at 48% 44%,#f4e6d23d,#0000 46%),radial-gradient(circle at 50% 58%,#d0c1ae57,#0000 66%),linear-gradient(#e8ded0fa,#cdbfadfa);border-color:#1c273a38;box-shadow:0 34px 84px #6048244d,inset 0 1px #ffffffd1,inset 0 -42px 88px #6c54383d,inset 0 0 140px #ffffff14}.stage:hover{transform:translateY(-2px)}.stage:before{content:"";border:2px solid color-mix(in srgb, var(--ring) 85%, #ffffff40 15%);box-shadow:0 0 0 1px #ffffff0f, 0 0 24px var(--ring-glow), 0 0 60px color-mix(in srgb, var(--ring-glow) 75%, transparent);filter:saturate(1.05);pointer-events:none;transition:border-color .25s var(--ease), box-shadow .25s var(--ease);background:radial-gradient(circle at 30% 20%,#ffffff2e,#0000 35%),linear-gradient(135deg,#ffffff14,#ffffff05);border-radius:999px;position:absolute;inset:-10px}body[data-ui-theme=light] .stage:before{border-color:color-mix(in srgb, var(--ring) 64%, #1c273a38 36%);box-shadow:0 0 0 1px #ffffff7a, 0 0 24px color-mix(in srgb, var(--ring-glow) 76%, transparent), 0 0 58px color-mix(in srgb, var(--ring-glow) 74%, transparent);background:radial-gradient(circle at 30% 20%,#ffffff6b,#0000 35%),linear-gradient(135deg,#ffffff38,#ffffff0a)}.stage:after{content:"";opacity:.55;pointer-events:none;border:1px dashed #ffffff24;border-radius:999px;position:absolute;inset:12px}body[data-ui-theme=light] .stage:after{border-color:#1c273a2e}.stage-viewport{border-radius:inherit;z-index:1;touch-action:pan-y;place-items:center;display:grid;position:absolute;inset:0;overflow:visible}.stage.is-zoomed .stage-viewport{cursor:grab;touch-action:none;overflow:hidden}.stage.is-zoomed .stage-viewport:active{cursor:grabbing}#molecule-svg{width:92%;height:92%;filter:drop-shadow(0 0 14px color-mix(in srgb, var(--focus) 55%, transparent));z-index:2;touch-action:inherit;transform-origin:50%;will-change:transform;position:relative;overflow:visible}body[data-ui-theme=light] #molecule-svg{filter:drop-shadow(0 16px 28px #1c273a3d)saturate(1.34)contrast(1.22)brightness(.86)}.zoom-controls{z-index:4;flex-direction:column;gap:8px;display:flex;position:absolute;bottom:16px;right:16px}.zoom-btn{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#f0f6ffeb;cursor:pointer;width:40px;height:40px;transition:transform .15s var(--ease), background .2s var(--ease), border-color .2s var(--ease), opacity .2s var(--ease);background:#080e189e;border:1px solid #ffffff24;border-radius:12px;place-items:center;padding:0;font-size:22px;font-weight:700;line-height:1;display:grid;box-shadow:0 6px 18px #00000052}.zoom-btn-reset{font-size:18px}.zoom-btn:hover:not(:disabled){border-color:color-mix(in srgb, var(--focus) 50%, #ffffff2e);background:#0e1624d1;transform:translateY(-1px)}.zoom-btn:active:not(:disabled){transform:scale(.94)}.zoom-btn:disabled{opacity:.38;cursor:default}body[data-ui-theme=light] .zoom-btn{color:#182234eb;background:#f8f4ece0;border-color:#1c273a2e;box-shadow:0 6px 16px #60482438}body[data-ui-theme=light] .zoom-btn:hover:not(:disabled){background:#fffcf6f7}.interactive-hotspot{cursor:pointer}.interactive-hotspot .hit-area{fill:#fff0;stroke:#0000;stroke-width:22px;pointer-events:all}.pair-bond{stroke-linecap:round;filter:drop-shadow(0 0 10px color-mix(in srgb, var(--focus) 32%, transparent))}.pair-zone-beacon{transform-box:fill-box;transform-origin:50%;animation:2.2s ease-in-out infinite pairPulse}.pair-partner-letter{letter-spacing:.04em;text-anchor:middle;dominant-baseline:central;paint-order:stroke fill;stroke:color-mix(in srgb, var(--accent-tone,var(--focus)) 44%, black);stroke-width:2.4px;font-weight:900}.pair-reveal-zone,.pair-reveal-letter,.pair-reveal-bond{transform-box:fill-box;transform-origin:0;animation-fill-mode:both}.pair-reveal-zone{transform-origin:50%;animation:.42s cubic-bezier(.2,.8,.2,1) both pairZoneReveal}.pair-reveal-letter{transform-origin:50%;animation:.44s cubic-bezier(.18,.88,.28,1) both pairLetterReveal}.pair-reveal-bond{animation:.42s cubic-bezier(.18,.88,.28,1) both pairBondReveal}@keyframes pairPulse{0%,to{opacity:.34;transform:scale(.98)}50%{opacity:.72;transform:scale(1.03)}}@keyframes pairZoneReveal{0%{opacity:0;transform:scale(.84)}to{opacity:1;transform:scale(1)}}@keyframes pairBondReveal{0%{opacity:0;transform:scaleX(.08)}to{opacity:1;transform:scaleX(1)}}@keyframes pairLetterReveal{0%{opacity:0;transform:translate(12px)scale(.94)}to{opacity:1;transform:translate(0)scale(1)}}.stage-tooltip{z-index:6;width:min(286px,100% - 32px);box-shadow:0 24px 55px #00000073, 0 0 28px color-mix(in srgb, var(--focus) 16%, transparent);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);pointer-events:none;opacity:0;transition:opacity .18s var(--ease), transform .18s var(--ease), border-color .18s var(--ease);background:linear-gradient(#080e1aeb,#080c16cc);border:1px solid #ffffff24;border-radius:18px;padding:14px 16px 15px;position:absolute;top:0;left:0;transform:translate(-50%,calc(-100% - 18px))scale(.96)}body[data-ui-theme=light] .stage-tooltip{box-shadow:0 24px 48px #6e502838, 0 0 26px color-mix(in srgb, var(--focus) 16%, transparent);background:linear-gradient(#f6eee4fa,#e0d5c6f5);border-color:#1c273a24}.stage-tooltip.is-visible{opacity:1;transform:translate(-50%,calc(-100% - 18px))scale(1)}.stage-tooltip.is-below{transform:translate(-50%,18px)scale(.96)}.stage-tooltip.is-below.is-visible{transform:translate(-50%,18px)scale(1)}.stage-tooltip-kicker{letter-spacing:.18em;text-transform:uppercase;color:#eaf0ff8f;font-size:11px}body[data-ui-theme=light] .stage-tooltip-kicker{color:#101b2b94}.stage-tooltip-title{letter-spacing:.02em;color:#fffffff5;margin-top:6px;font-size:18px;font-weight:900}body[data-ui-theme=light] .stage-tooltip-title{color:#0f1b2a}.stage-tooltip-body{color:#eaf0ffd1;margin-top:8px;font-size:13px;line-height:1.62}body[data-ui-theme=light] .stage-tooltip-body{color:#0f1b2ad6}.helper-toggle{white-space:nowrap;color:#eaf0ffe6;cursor:pointer;transition:transform .18s var(--ease), border-color .18s var(--ease), box-shadow .18s var(--ease), background .18s var(--ease);-webkit-tap-highlight-color:transparent;background:linear-gradient(#00000042,#0000002e);border:1px solid #ffffff1a;border-radius:999px;flex:none;align-items:center;gap:10px;padding:7px 20px 7px 8px;display:flex;box-shadow:0 10px 24px #0000002e}body[data-ui-theme=light] .helper-toggle{color:#0f1b2aeb;background:linear-gradient(#f4ece1fa,#e0d4c4eb);border-color:#1c273a24;box-shadow:0 14px 26px #6e50282e}.helper-toggle:hover{border-color:#ffffff29;transform:translateY(-1px)}.helper-toggle:focus-visible{outline:2px solid var(--focus);outline-offset:3px}.helper-toggle[data-state=on]{border-color:color-mix(in srgb, var(--focus) 30%, #ffffff29);box-shadow:0 12px 26px #00000038, 0 0 18px color-mix(in srgb, var(--focus) 14%, transparent);background:linear-gradient(180deg, color-mix(in srgb, var(--focus) 9%, #00000038), #0000002e)}body[data-ui-theme=light] .helper-toggle[data-state=on]{border-color:color-mix(in srgb, var(--focus) 34%, #1c273a1f);box-shadow:0 14px 28px #6e502833, 0 0 22px color-mix(in srgb, var(--focus) 18%, transparent);background:linear-gradient(180deg, color-mix(in srgb, var(--focus) 24%, white), #e4d7c7f0)}.helper-toggle-pill{background:#ffffff1a;border:1px solid #ffffff1f;border-radius:999px;flex:0 0 40px;height:22px;position:relative;box-shadow:inset 0 0 0 1px #ffffff08}body[data-ui-theme=light] .helper-toggle-pill{background:#1c273a1f;border-color:#1c273a1f;box-shadow:inset 0 0 0 1px #ffffffb8}.helper-toggle-knob{width:16px;height:16px;transition:transform .22s var(--ease), background .22s var(--ease), box-shadow .22s var(--ease);background:linear-gradient(#ffffffd9,#d6ddebb8);border-radius:999px;position:absolute;top:2px;left:2px;box-shadow:0 2px 10px #00000042}.helper-toggle[data-state=on] .helper-toggle-pill{background:color-mix(in srgb, var(--focus) 28%, #ffffff17);border-color:color-mix(in srgb, var(--focus) 44%, #ffffff2e)}.helper-toggle[data-state=on] .helper-toggle-knob{background:linear-gradient(180deg, color-mix(in srgb, var(--focus) 74%, white), color-mix(in srgb, var(--focus) 55%, #dfe9ff));box-shadow:0 2px 14px color-mix(in srgb, var(--focus) 26%, transparent);transform:translate(18px)}.helper-toggle-copy{text-align:left;align-items:center;display:flex}.helper-toggle-title{letter-spacing:.12em;text-transform:uppercase;color:#fffffff0;font-size:11px;font-weight:900}body[data-ui-theme=light] .helper-toggle-title{color:#0f1b2ae6}.info-badge{pointer-events:none;transform-box:fill-box;transform-origin:50%;animation:1.8s ease-in-out infinite infoBadgePulse}.info-badge-shell{filter:drop-shadow(0 0 14px color-mix(in srgb, var(--focus) 24%, transparent))}.info-badge-text{text-anchor:middle;dominant-baseline:central;fill:#071018;font-size:16px;font-weight:900}@keyframes infoBadgePulse{0%,to{opacity:.76;transform:scale(.96)}50%{opacity:1;transform:scale(1.06)}}.phosphate-greek{paint-order:stroke fill;stroke:color-mix(in srgb, var(--accent-tone,var(--phos)) 42%, black);stroke-width:2.4px;letter-spacing:.02em;font-family:ui-serif,Georgia,Times New Roman,serif;font-size:18px;font-style:italic;font-weight:900}.bond-line{stroke-linecap:round;fill:none}.bond-joint{opacity:1;stroke:var(--highlight)!important}.bond-main{stroke-width:5px}.bond-link{stroke-width:4px}.bond-branch{stroke-width:5px}.high-energy-bond{stroke-dasharray:6 6;animation:1s linear infinite bondFlow}@keyframes bondFlow{0%{stroke-dashoffset:12px}to{stroke-dashoffset:0}}.atom-text{text-anchor:middle;dominant-baseline:central;font-weight:800}.accent-text{paint-order:stroke fill;stroke:color-mix(in srgb, var(--accent-tone,var(--focus)) 46%, black);stroke-width:1.9px;stroke-linejoin:round}.ring-structure{stroke-width:4px;stroke-linejoin:round;fill:#ffffff0f}.chem-number{pointer-events:none;paint-order:stroke fill;stroke:#00000059;stroke-width:2px;font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace;font-weight:800}.chem-num-normal{fill:var(--num-normal);font-size:14px}.chem-num-important{fill:var(--highlight);stroke:color-mix(in srgb, var(--highlight) 48%, black);stroke-width:2.4px;text-shadow:0 0 10px #fff1b873;font-size:20px}.lod-num,.lod-atom{transition:opacity .28s}.lod-atom,.stage.detail-on .lod-num{opacity:0}.stage.detail-on .lod-atom{opacity:1}@media (prefers-reduced-motion:reduce){.lod-num,.lod-atom{transition:none}}.highlight-bond{opacity:1;stroke:var(--highlight)!important}.highlight-text{paint-order:stroke fill;stroke:color-mix(in srgb, var(--accent-tone,var(--highlight)) 50%, black);stroke-width:1.8px;text-shadow:0 0 10px #fff1b88c;fill:var(--highlight)!important}.bond-term{stroke:var(--highlight);opacity:1}.controls-deck{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:linear-gradient(#ffffff14,#ffffff09),radial-gradient(380px 200px at 15% 0,#7ae7ff14,#0000 60%),radial-gradient(320px 220px at 100% 10%,#d57bff12,#0000 65%);border:1px solid #ffffff1a;border-radius:28px;grid-area:controls;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;padding:16px;display:grid;box-shadow:0 26px 70px #00000057}body[data-ui-theme=light] .controls-deck{background:linear-gradient(#e4d9caf0,#cebfaddb),radial-gradient(380px 200px at 15% 0,#7ae7ff1f,#0000 60%),radial-gradient(320px 220px at 100% 10%,#d57bff1c,#0000 65%);border-color:#1c273a29;box-shadow:0 28px 68px #6048243d,inset 0 1px #ffffff6b}.panel-card{--panel-accent:var(--focus);border:1px solid color-mix(in srgb, var(--panel-accent) 12%, #ffffff1a);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:linear-gradient(#0d1322eb,#0a0e18d1);border-radius:22px;min-height:168px;padding:14px 14px 13px;position:relative;overflow:hidden;box-shadow:inset 0 1px #ffffff0a,0 14px 30px #00000038}body[data-ui-theme=light] .panel-card{border-color:color-mix(in srgb, var(--panel-accent) 30%, #1c273a29);background:linear-gradient(#f0e7dafa,#dacdbcf5);box-shadow:inset 0 1px #ffffffd6,0 18px 38px #60482433}.panel-card:before{content:"";background:radial-gradient(180px 120px at 10% 0%, color-mix(in srgb, var(--panel-accent) 16%, transparent), transparent 72%);pointer-events:none;opacity:.9;position:absolute;inset:0}.panel-card[data-panel=sugar]{--panel-accent:var(--highlight)}.panel-card[data-panel=phosphate]{--panel-accent:var(--phos)}.panel-card[data-panel=base]{--panel-accent:var(--focus)}.panel-card[data-panel=three-prime]{--panel-accent:var(--warn)}.control-group{z-index:1;flex-direction:column;gap:10px;height:100%;display:flex;position:relative}.label{letter-spacing:.16em;text-transform:uppercase;color:var(--muted);align-items:center;gap:10px;font-size:12px;display:flex}.label:before{content:"";background:var(--panel-accent,var(--focus));width:10px;height:10px;box-shadow:0 0 0 2px #ffffff1a, 0 0 18px color-mix(in srgb, var(--panel-accent,var(--focus)) 42%, transparent);opacity:.9;border-radius:999px}.switcher{border-radius:var(--r-md);background:#02060e8c;border:1px solid #ffffff1a;grid-template-columns:54px 1fr 54px;align-items:center;height:56px;display:grid;overflow:hidden;box-shadow:inset 0 0 0 1px #ffffff05}body[data-ui-theme=light] .switcher{background:linear-gradient(#e7ddcffa,#d6c9b8fa);border-color:#1c273a24;box-shadow:inset 0 0 0 1px #ffffffd1,0 2px #ffffff61}.switcher.is-disabled{background:#02060e61;border-color:#ffffff12;box-shadow:inset 0 0 0 1px #ffffff08}body[data-ui-theme=light] .switcher.is-disabled{background:#cec3b4e0;border-color:#1c273a1f;box-shadow:inset 0 0 0 1px #ffffffc2}.arrow-btn{color:#eaf0ffc7;cursor:pointer;height:56px;transition:transform .18s var(--ease), background .18s var(--ease), color .18s var(--ease);background:0 0;border:none;place-items:center;font-size:20px;display:grid}body[data-ui-theme=light] .arrow-btn{color:#182437d1}.arrow-btn:hover{color:var(--focus);background:#ffffff0f;transform:scale(1.08)}body[data-ui-theme=light] .arrow-btn:hover{background:#1c273a1a}.arrow-btn:active{transform:scale(.98)}.arrow-btn:disabled{cursor:not-allowed;color:#eaf0ff47;background:0 0;transform:none}body[data-ui-theme=light] .arrow-btn:disabled{color:#1c273a52}.switcher.is-disabled .control-display{color:#eaf0ff7a;text-shadow:none}body[data-ui-theme=light] .switcher.is-disabled .control-display{color:#1c273a80}.arrow-btn,.switcher,.panel-card button{touch-action:manipulation;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}.control-display{text-align:center;letter-spacing:.02em;color:#eaf0ffeb;text-shadow:0 0 18px #0009;text-wrap:balance;font-size:15px;font-weight:850;line-height:1.12}body[data-ui-theme=light] .control-display{color:#0f1b2a;text-shadow:none}.info-panel{border-radius:var(--r-lg);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:linear-gradient(#ffffff14,#ffffff0a);border:1px solid #ffffff1f;width:min(720px,96%);overflow:hidden;box-shadow:0 20px 60px #0000006b}body[data-ui-theme=light] .info-panel{background:linear-gradient(#f0e7dafa,#d8cbbaf5);border-color:#1c273a24;box-shadow:0 24px 54px #60482438}.info-accent{background:linear-gradient(90deg, var(--focus), var(--ring));height:4px;box-shadow:0 0 20px var(--focus-glow)}.info-body{padding:16px 18px 18px;position:relative}.info-body .helper-toggle{z-index:2;position:absolute;top:14px;right:14px}.molecule-title{letter-spacing:.02em;flex-wrap:wrap;align-items:center;gap:10px;padding-right:100px;font-size:28px;font-weight:900;display:flex}.molecule-title .chip{color:#eaf0ffc2;background:#00000038;border:1px solid #ffffff24;border-radius:999px;padding:4px 10px;font-size:12px}body[data-ui-theme=light] .molecule-title .chip{color:#182437c7;background:#1c273a14;border-color:#1c273a1f}.molecule-title .helper-toggle{align-self:center}.molecule-subtitle{color:#eaf0ffbf;letter-spacing:.03em;margin-top:6px;font-size:14px}body[data-ui-theme=light] .molecule-subtitle{color:#141f30bd}.molecule-desc{color:#eaf0ffc7;margin-top:12px;font-size:14px;line-height:1.7}body[data-ui-theme=light] .molecule-desc{color:#101b2adb}#toast-container{z-index:120;pointer-events:none;flex-direction:column;gap:10px;display:flex;position:fixed;top:20px;left:50%;transform:translate(-50%)}.toast{color:#ffffffeb;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);opacity:0;animation:slideDown .35s var(--ease) forwards;background:#0000008c;border:1px solid #ffffff24;border-radius:999px;align-items:center;gap:10px;padding:12px 16px;display:flex;transform:translateY(-12px);box-shadow:0 18px 50px #00000073}body[data-ui-theme=light] .toast{color:#0f1b2a;background:#f4ece1fa;border-color:#1c273a24;box-shadow:0 18px 38px #6e50282e}.toast:before{content:"⚠";background:color-mix(in srgb, var(--warn) 40%, #0003);border:1px solid #ffffff29;border-radius:999px;place-items:center;width:22px;height:22px;display:grid;box-shadow:0 0 22px #ff4d6d47}.toast.hide{animation:fadeOut .35s var(--ease) forwards}@keyframes slideDown{to{opacity:1;transform:translateY(0)}}@keyframes fadeOut{to{opacity:0;transform:translateY(-10px)}}.shake-hard{animation:.4s cubic-bezier(.36,.07,.19,.97) both shake-anim}@keyframes shake-anim{10%,90%{transform:translate(-2px,1px)rotate(.5deg)}20%,80%{transform:translate(3px,-2px)rotate(-.5deg)}30%,50%,70%{transform:translate(-5px,3px)rotate(1deg)}40%,60%{transform:translate(5px,-3px)rotate(-1deg)}}.aberration-impact{animation:.3s ease-out forwards aberration-anim}@keyframes aberration-anim{0%{text-shadow:4px 0 #f00c,-4px 0 #0ffc}to{text-shadow:0 0 #f000,0 0 #0ff0}}#app-shell.shake-hard{animation:.4s cubic-bezier(.36,.07,.19,.97) both shake-anim}#app-shell.aberration-impact{animation:.3s ease-out forwards aberration-anim}.ui-thump{animation:.2s ease-out ui-thump-anim}@keyframes ui-thump-anim{0%{transform:scale(1)}50%{transform:scale(1.02)}to{transform:scale(1)}}.atom-pop{transform-box:fill-box;transform-origin:50%;animation:.6s cubic-bezier(.34,1.56,.64,1) both atom-pop-anim}@keyframes atom-pop-anim{0%{filter:brightness()drop-shadow(0 0 #fff0);opacity:.8;transform:scale(.95)}40%{filter:brightness(1.5) drop-shadow(0 0 15px var(--focus));opacity:1;transform:scale(1.15)}to{filter:brightness()drop-shadow(0 0 #fff0);opacity:1;transform:scale(1)}}.control-help{color:#eaf0ffb8;border-radius:var(--r-sm);text-align:center;background:#0408127a;border:1px solid #ffffff14;justify-content:center;align-items:center;min-height:60px;margin-top:auto;padding:10px 12px;font-size:12px;line-height:1.55;display:flex;box-shadow:inset 0 0 0 1px #ffffff08}body[data-ui-theme=light] .control-help{color:#141f30cc;background:#e4d9c9f5;border-color:#1c273a1f;box-shadow:inset 0 0 0 1px #ffffffb8}body[data-ui-theme=light] .chem-number{stroke:#f8f2e8d6}body[data-ui-theme=light] .chem-num-normal{fill:#1c273ab3}body[data-ui-theme=light] .chem-num-important{fill:color-mix(in srgb, var(--highlight) 82%, #734800);stroke:color-mix(in srgb, var(--highlight) 62%, black);text-shadow:0 0 10px #c98a1c47}body[data-ui-theme=light] .pair-partner-letter{stroke:color-mix(in srgb, var(--accent-tone,var(--focus)) 60%, black);stroke-width:2.6px}body[data-ui-theme=light] .highlight-text{stroke:color-mix(in srgb, var(--accent-tone,var(--highlight)) 60%, black);text-shadow:0 0 14px #c98a1c4d}body[data-ui-theme=light] .accent-text{stroke:color-mix(in srgb, var(--accent-tone,var(--focus)) 58%, black)}body[data-ui-theme=light] .phosphate-greek{stroke:color-mix(in srgb, var(--accent-tone,var(--phos)) 58%, black)}.help-pop{transform-origin:50%;animation:.55s cubic-bezier(.34,1.56,.64,1) both help-pop-anim}@keyframes help-pop-anim{0%{filter:brightness();opacity:.86;transform:scale(.98)}45%{filter:brightness(1.35);opacity:1;box-shadow:0 0 18px color-mix(in srgb, var(--focus) 26%, transparent);border-color:color-mix(in srgb, var(--focus) 26%, #ffffff1a);transform:scale(1.05)}to{filter:brightness();opacity:1;box-shadow:none;transform:scale(1)}}@media (min-width:1101px){.container{grid-template:auto auto/260px minmax(0,1fr) 260px;align-items:center;gap:26px}.controls-deck{display:contents}.panel-card{border-radius:var(--r-lg);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:linear-gradient(#ffffff14,#ffffff0a);border:1px solid #ffffff1f;min-height:0;padding:14px;box-shadow:0 18px 50px #00000061}.panel-card:before{display:none}.panel-card[data-panel=sugar]{grid-area:1/1}.panel-card[data-panel=phosphate]{grid-area:2/1}.panel-card[data-panel=base]{grid-area:1/3}.panel-card[data-panel=three-prime]{grid-area:2/3}.stage-wrapper{grid-area:1/2/span 2;align-self:center}.control-display{text-wrap:pretty;font-size:14px}.control-help{background:#00000038;border:1px solid #ffffff1a;min-height:0;margin-top:10px}}@media (max-width:1100px){body{-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain;padding:calc(18px + env(safe-area-inset-top,0px)) env(safe-area-inset-right,0px) calc(34px + env(safe-area-inset-bottom,0px)) env(safe-area-inset-left,0px);justify-content:center;align-items:flex-start;overflow-y:auto}.container{grid-template-columns:1fr;grid-template-areas:"controls""stage";align-items:start;gap:18px}.controls-deck{justify-self:center;gap:12px;width:min(760px,100%);padding:14px}.stage{width:360px;height:360px}.stage-wrapper{gap:14px}}@media (max-width:576px){.floating-tools{top:calc(env(safe-area-inset-top,0px) + 12px);right:calc(env(safe-area-inset-right,0px) + 12px);gap:8px}.page-dock{right:calc(env(safe-area-inset-right,0px) + 12px);bottom:calc(env(safe-area-inset-bottom,0px) + 12px)}.language-switch{padding:3px}.page-switch{border-radius:18px;min-width:152px;padding:5px}.page-link{border-radius:12px;min-width:66px;height:36px;padding:0 12px;font-size:10px}.language-btn{min-width:48px;height:36px;padding:0 12px;font-size:11px}.theme-toggle{width:42px;height:42px}.theme-toggle svg{width:20px;height:20px}.container{width:min(100%, calc(100vw - 18px - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px)));gap:14px}.controls-deck{border-radius:22px;gap:10px;padding:10px}.panel-card{border-radius:16px;min-height:0;padding:10px 10px 9px}.control-group{gap:8px}.label{letter-spacing:.12em;gap:8px;min-height:30px;margin-bottom:2px;font-size:10.5px}.switcher{background:#00000042;border:1px solid #ffffff1a;border-radius:12px;grid-template-columns:44px 1fr 44px;height:42px}.arrow-btn{height:42px;font-size:18px}.control-display{letter-spacing:.01em;font-size:12px;line-height:1.1}.control-help{border-radius:12px;min-height:52px;padding:7px 8px;font-size:10.5px;line-height:1.4}.stage{width:min(300px,82vw);height:min(300px,82vw)}.info-panel{width:100%}.stage-wrapper{gap:10px}.stage-tooltip{border-radius:16px;width:calc(100% - 24px);padding:12px 13px 13px}.info-body .helper-toggle{top:12px;right:12px}.stage-tooltip-title{font-size:16px}.stage-tooltip-body{font-size:12px;line-height:1.56}.helper-toggle{gap:8px;padding:6px 44px 6px 7px}.helper-toggle-pill{flex-basis:36px;height:20px}.helper-toggle-knob{width:14px;height:14px}.helper-toggle[data-state=on] .helper-toggle-knob{transform:translate(16px)}.helper-toggle-title{letter-spacing:.1em;font-size:10px}.molecule-title{padding-right:84px}}