/* Direct-manipulation molecule builder */
.onl-parts-tray{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem;margin-top:.65rem}.onl-part{min-height:84px;padding:.62rem;border:1px solid #d5e3e6;border-radius:15px;background:linear-gradient(145deg,#fff,#f4f8f8);color:#385865;text-align:left;cursor:grab;touch-action:none;user-select:none;transition:border-color .2s,box-shadow .2s,transform .2s}.onl-part:hover,.onl-part:focus-visible,.onl-part.active{border-color:#2f8c86;box-shadow:0 8px 22px rgba(37,108,105,.13);outline:0;transform:translateY(-2px)}.onl-part.dragging{cursor:grabbing;opacity:.52}.onl-part strong{display:block;color:#246f70;font-size:1.15rem;letter-spacing:-.02em}.onl-part span{display:block;margin-top:.22rem;font-size:.67rem;font-weight:800}.onl-part small{display:block;margin-top:.12rem;color:#748890;font-size:.55rem}.onl-drag-help{margin:.65rem 0 0;padding:.62rem .7rem;border-radius:11px;background:#edf6f4;color:#587079;font-size:.61rem;line-height:1.5}.onl-build-status{display:flex;align-items:center;gap:.5rem;margin:.7rem .8rem 0;padding:.58rem .7rem;border:1px solid #dce7e8;border-radius:12px;background:#f7faf9;color:#627780}.onl-build-status b{color:#315864;font-size:.68rem;white-space:nowrap}.onl-build-status span{font-size:.61rem;line-height:1.4}.onl-build-status.active{border-color:#86bbb5;background:#eef8f6}.onl-build-status.success{border-color:#9fcfb4;background:#eff9f3}.onl-build-status.warning{border-color:#e2bd89;background:#fff8ed}.onl-builder-board{position:relative;min-height:250px;padding:2.3rem 1rem 1rem}.onl-builder-board .onl-chain{overflow:visible}.onl-builder-board .onl-carbon,.onl-builder-board .onl-bond{position:relative;isolation:isolate}.onl-builder-board .onl-carbon{cursor:default}.onl-builder-board .onl-carbon i,.onl-builder-board .onl-bond i{position:absolute;z-index:4;display:none;color:#246d69;font-size:.52rem;font-style:normal;font-weight:800;white-space:nowrap}.onl-builder-board .onl-carbon i{left:50%;top:-28px;transform:translateX(-50%)}.onl-builder-board .onl-bond i{left:50%;bottom:-27px;transform:translateX(-50%)}.onl-builder-board .onl-bond em{font-style:normal}.onl-builder-board .drop-valid{cursor:pointer}.onl-builder-board .drop-valid:before{content:"";position:absolute;z-index:-1;inset:-8px;border:2px dashed #36a39a;border-radius:14px;background:rgba(215,244,239,.72);animation:onlTargetPulse 1.15s ease-in-out infinite}.onl-builder-board .onl-bond.drop-valid:before{inset:-13px -5px}.onl-builder-board .drop-valid i{display:block}.onl-builder-board .drop-invalid{opacity:.43}.onl-builder-board .drop-hover:before{border-style:solid;border-color:#167b75;background:#c9eee7;box-shadow:0 0 0 6px rgba(54,163,154,.13)}.onl-builder-board .drop-invalid.drop-hover:before{content:"";position:absolute;z-index:-1;inset:-8px;border:2px solid #c67b55;border-radius:14px;background:#fff0e6}.onl-drag-ghost{position:fixed;z-index:10000;min-width:105px;padding:.58rem .72rem;border:2px solid #2c8a83;border-radius:14px;background:#fff;box-shadow:0 16px 38px rgba(28,73,79,.26);pointer-events:none;transform:translate(-50%,-50%) rotate(-2deg)}.onl-drag-ghost strong{display:block;color:#216c6d;font-size:1.08rem}.onl-drag-ghost span{display:block;margin-top:.1rem;color:#60747c;font-size:.58rem;font-weight:800}@keyframes onlTargetPulse{50%{box-shadow:0 0 0 6px rgba(54,163,154,.11)}}
@media(max-width:850px){.onl-builder-layout{display:flex;flex-direction:column}.onl-workbench{order:1}.onl-palette{order:2}.onl-parts-tray{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:560px){.onl-parts-tray{grid-template-columns:repeat(2,minmax(0,1fr))}.onl-part{min-height:78px}.onl-build-status{align-items:flex-start;flex-direction:column;gap:.15rem}.onl-builder-board{min-height:235px;padding:2.4rem .6rem 1rem}.onl-builder-board .onl-chain{padding:1.8rem .2rem}.onl-builder-board .onl-carbon{min-width:58px}.onl-builder-board .onl-carbon i,.onl-builder-board .onl-bond i{font-size:.48rem}}
@media(prefers-reduced-motion:reduce){.onl-part{transition:none}.onl-builder-board .drop-valid:before{animation:none}}
.onl-return-zone{display:flex;flex-direction:column;gap:.12rem;margin-top:.55rem;padding:.68rem .75rem;border:2px dashed #ccdadd;border-radius:13px;background:#f7faf9;color:#71848b;transition:.2s}.onl-return-zone strong{font-size:.68rem}.onl-return-zone span{font-size:.56rem}.onl-return-zone.active{border-color:#b97b63;background:#fff7f1;color:#8e543e}.onl-return-zone.drop-hover{border-style:solid;background:#ffe8dc;box-shadow:0 0 0 5px rgba(185,123,99,.12);transform:scale(1.015)}.onl-attached-piece{position:absolute;z-index:7;left:50%;bottom:-27px;min-width:54px;padding:.2rem .38rem;border:1px solid #7460ae;border-radius:999px;background:#fff;color:#5e4a98;font-size:.58rem;font-weight:900;line-height:1;cursor:grab;touch-action:none;transform:translateX(-50%);box-shadow:0 4px 10px rgba(74,58,124,.18)}.onl-attached-piece small{position:static!important;display:inline!important;margin-left:.18rem;color:#8c82aa!important;font-size:.43rem!important}.onl-attached-piece.dragging{opacity:.42;cursor:grabbing}.onl-bond .onl-attached-piece{bottom:-35px}.onl-builder-board .onl-carbon.featured,.onl-builder-board .onl-bond.featured{margin-bottom:12px}.onl-builder-board .onl-carbon.drop-valid i{top:-31px}.onl-builder-board .onl-bond.drop-valid i{bottom:-48px}
@media(max-width:560px){.onl-attached-piece{bottom:-25px;min-width:48px}.onl-bond .onl-attached-piece{bottom:-34px}}
.onl-drag-ghost{will-change:transform,opacity}
.onl-displayed-svg text.nitrogen{fill:#355fa7}
.onl-builder-board{padding-top:4.7rem}.onl-functional-branch{position:absolute;z-index:5;left:50%;bottom:calc(100% - 5px);display:flex;height:62px;align-items:center;flex-direction:column;justify-content:flex-start;pointer-events:none;transform:translateX(-50%)}.onl-functional-branch b{display:grid;place-items:center;min-width:30px;height:25px;padding:0 .2rem;border-radius:8px;background:#fff;color:#b44f50;font-size:.78rem;line-height:1;box-shadow:0 2px 8px rgba(52,75,82,.1)}.onl-functional-branch.alcohol b{color:#9d4d52}.onl-branch-lines{display:flex;height:35px;align-items:stretch;justify-content:center;gap:5px;padding-top:2px}.onl-branch-lines u{display:block;width:2px;height:33px;border-radius:2px;background:#5f7781;text-decoration:none}.onl-functional-branch.carbonyl .onl-branch-lines u{width:2px;background:#6754a4}.onl-carbon.featured:has(.onl-functional-branch) strong{transform:translateY(2px)}
@media(max-width:560px){.onl-builder-board{padding-top:4.4rem}.onl-functional-branch{height:58px}.onl-branch-lines,.onl-branch-lines u{height:31px}}
.onl-molecule.quiz{overflow-x:hidden}.onl-molecule.quiz .onl-displayed-svg{width:min(100%,var(--formula-width,760px));max-width:100%;height:205px;min-width:0}