/* ===== מעבדת המודלים המולקולריים + משוב תלת-ממדי ===== */
.lab{--lab-bg:linear-gradient(160deg,#1d1640 0%,#2a1f63 55%,#3b2a7d 100%)}
.lab-head{text-align:center;padding:6px 4px 10px}
.lab-head h1{margin:.15em 0;font-size:1.45rem}
@media (max-width:480px){.lab-head p{font-size:.9rem}}
.lab-head p{margin:0 auto 10px;color:var(--muted,#6b6785);max-width:34em}
.lab-modes{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}
.lab-modes .chip{font-size:1rem;padding:8px 16px}
.lab-picker{background:var(--card,#fff);border-radius:18px;box-shadow:var(--shadow);padding:10px;margin:10px 0}
.lab-groups{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding-bottom:6px;-webkit-overflow-scrolling:touch}
.lab-groups::-webkit-scrollbar{display:none}
.lab-groups .chip{flex:0 0 auto;white-space:nowrap;font-size:.85rem}
.lab-mols{display:flex;flex-wrap:nowrap;gap:6px;padding:4px 2px 4px;overflow-x:auto;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
@media (min-width:640px){.lab-mols{flex-wrap:wrap;overflow:visible}}
.lab-mol{flex:0 0 auto}
.lab-mol{display:inline-flex;flex-direction:column;align-items:center;gap:0;min-width:64px;padding:6px 10px;border-radius:12px;border:1.5px solid var(--line,#e6e0f5);background:#fff;cursor:pointer;line-height:1.25;transition:transform .12s,border-color .12s}
.lab-mol .chem{font-size:1.05rem}
.lab-mol small{font-size:.7rem;color:var(--muted,#6b6785);max-width:9em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lab-mol.sel{border-color:var(--pri,#6a4ce0);background:var(--priSoft,#eee8ff);box-shadow:0 0 0 2px rgba(106,76,224,.18)}
.lab-mol:active{transform:scale(.96)}
.lab-main{background:var(--card,#fff);border-radius:20px;box-shadow:var(--shadow);padding:12px;margin-top:10px}
.lab-title{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px;margin:2px 4px 8px}
.lab-big{font-size:1.9rem;font-weight:800;color:var(--ink,#24213a)}
.lab-big .chem{font-weight:800}
.lab-name{font-weight:700;font-size:1.1rem}
.lab-tag{font-size:.75rem;font-weight:700;padding:2px 9px;border-radius:999px;background:#fff1d6;color:#8a5a00}
.lab-tag.mol{background:#e3f7ef;color:#0d6e52}
.lab-views{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;background:#f1edff;border-radius:14px;padding:4px;margin-bottom:10px}
.lab-vbtn{border:0;background:transparent;border-radius:10px;padding:8px 4px;font-size:.84rem;font-weight:600;color:var(--muted,#6b6785);cursor:pointer;line-height:1.2}
.lab-vbtn.on{background:#fff;color:var(--pri,#6a4ce0);box-shadow:0 2px 8px rgba(60,40,140,.12)}
@media (max-width:420px){.lab-views{grid-template-columns:repeat(2,1fr)}}
.lab-stage{min-height:120px}
.lab-canvas{position:relative;height:clamp(280px,58vh,460px);border-radius:16px;background:radial-gradient(circle at 50% 40%,#ffffff 0%,#f1ecff 55%,#e2d9ff 100%);overflow:hidden;box-shadow:inset 0 0 0 1px rgba(106,76,224,.12)}
.lab-canvas.compact{height:clamp(260px,40vh,340px)}
.lab-canvas.small{height:clamp(220px,34vh,280px)}
.m3d{position:absolute;inset:0}
.m3d-canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}
.m3d.grab .m3d-canvas{cursor:grabbing}
.m3d-canvas:focus-visible{outline:3px solid #ffb703;outline-offset:-3px;border-radius:16px}
.lab-load{position:absolute;inset:0;display:grid;place-items:center;color:var(--muted,#6b6785);font-size:.9rem}
.lab-spin{display:inline-block;width:18px;height:18px;border-radius:50%;border:3px solid #d9d0ff;border-top-color:var(--pri,#6a4ce0);animation:labspin .8s linear infinite;vertical-align:-4px;margin-inline-end:6px}
@keyframes labspin{to{transform:rotate(360deg)}}
.lab-fallback{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:10px;overflow:auto}
.lab-fallback svg{max-width:100%;height:auto}
.lab-tools{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;margin-top:8px}
.lab-tools .btn.on{background:var(--pri,#6a4ce0);color:#fff;border-color:var(--pri,#6a4ce0)}
.lab-sq{min-width:40px;font-weight:800}
.lab-hint{text-align:center;margin:6px 0 0}
.lab-small{font-size:.82rem;color:var(--muted,#6b6785)}
.lab-legend{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.lab-leg{display:inline-flex;align-items:center;gap:5px;padding:5px 10px;border-radius:999px;border:1.5px solid var(--line,#e6e0f5);background:#fff;font-size:.85rem;cursor:pointer}
.lab-leg i,.lab-colorkey i,.lab-card-h i,.lab-rx-tbl i{display:inline-block;width:14px;height:14px;border-radius:50%;border:1px solid rgba(0,0,0,.35);box-shadow:inset -2px -2px 3px rgba(0,0,0,.15)}
.lab-leg small{color:var(--muted,#6b6785);font-weight:700}
.lab-leg.on{border-color:#e0a100;background:#fff7dc;box-shadow:0 0 0 2px rgba(255,201,77,.45)}
.lab-colorkey{display:flex;flex-wrap:wrap;gap:4px 10px;justify-content:center;font-size:.78rem;color:var(--muted,#6b6785);margin:8px 0}
.lab-colorkey span{display:inline-flex;align-items:center;gap:4px}
.lab-info:empty{display:none}
.lab-info{margin-top:10px}
.lab-card{background:linear-gradient(180deg,#fffaf0,#fff);border:1.5px solid #ffd77a;border-radius:16px;padding:10px 12px;animation:labpop .25s ease-out}
.lab-card.small{padding:8px 10px}
.lab-card-h{display:flex;align-items:center;gap:8px;font-size:1.1rem}
.lab-card-h i{width:20px;height:20px}
.lab-card ul{margin:6px 0 8px;padding-inline-start:18px}
.lab-card li{margin:3px 0;font-size:.92rem}
.lab-card-l{margin:4px 0 6px;font-size:.88rem;color:var(--muted,#6b6785)}
@keyframes labpop{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.lab-desc{margin-top:10px}
.lab-shape{background:#f4f1ff;border-radius:12px;padding:8px 12px;font-size:.92rem}
.lab-ang{font-weight:700}
.lab-note{background:#f7f5ff;border-radius:12px;padding:8px 12px;margin:8px 0 0;font-size:.9rem}
.lab-note.warn{background:#fff4e0}
.lab-formula{text-align:center;padding:16px 8px}
.lab-ftop{font-size:2.6rem;font-weight:800;line-height:1.2}
.lab-flab{font-size:.8rem;font-weight:700;color:var(--pri,#6a4ce0);letter-spacing:.02em;margin-bottom:8px}
.lab-ions{font-size:1.4rem}
.lab-2d{text-align:center}
.lab-2dbox{display:flex;justify-content:center;align-items:center;min-height:200px;padding:10px;border-radius:16px;background:#fbfaff;box-shadow:inset 0 0 0 1px rgba(106,76,224,.1);overflow:auto}
.lab2d{max-width:100%;height:auto}
.lab2d line{stroke:#7d7896;stroke-linecap:round}
.lab2d-atom{cursor:pointer;transition:opacity .2s}
.lab2d-atom.dim{opacity:.3}
.lab2d-atom.hl circle:first-child{stroke:#e0a100;stroke-width:4}
.lab-cmp{display:grid;grid-template-columns:1fr;gap:10px}
.lab-cmp-col{background:#fbfaff;border-radius:16px;padding:8px;box-shadow:inset 0 0 0 1px rgba(106,76,224,.1);min-width:0}
.lab-cmp-col h3{margin:2px 4px 6px;font-size:.95rem;color:var(--pri,#6a4ce0)}
.lab-cmp .lab-formula{padding:8px 4px}
.lab-cmp .lab-ftop{font-size:2rem}
.lab-cmp .lab-2dbox{min-height:160px;background:#fff}
@media (min-width:760px){.lab-cmp{grid-template-columns:1fr 1fr 1.35fr;align-items:stretch}.lab-cmp .lab-canvas.compact{height:300px}}
/* אתגר חקר */
.lab-ch{background:var(--card,#fff);border-radius:20px;box-shadow:var(--shadow);padding:12px;margin-top:10px}
.lab-ch-head h2{margin:.1em 0;font-size:1.2rem}
.lab-ch-head p{margin:0 0 8px;color:var(--muted,#6b6785);font-size:.92rem}
.lab-dots{display:flex;align-items:center;gap:6px;margin-bottom:8px}
.lab-dots span{width:12px;height:12px;border-radius:50%;background:#e6e0f5}
.lab-dots span.done{background:var(--ok,#14966f)}
.lab-dots span.cur{background:var(--pri,#6a4ce0);box-shadow:0 0 0 3px rgba(106,76,224,.2)}
.lab-dots .lab-dtxt{width:auto;height:auto;background:none;box-shadow:none;font-size:.8rem;color:var(--muted,#6b6785);margin-inline-start:6px}
.lab-q{margin-top:10px}
.lab-qcard .qtext{font-size:1.02rem}
.opts.cols1{grid-template-columns:1fr}
.lab-next{margin-top:8px}
.lab-done{text-align:center}
.lab-done .row{justify-content:center;flex-wrap:wrap;gap:8px}
/* משוב: נוסחה הופכת למודל */
.lab-rev{margin-top:10px;border-radius:18px;padding:10px;background:linear-gradient(180deg,#f5f1ff,#fff);border:1.5px solid #d9cffd}
.lab-rev.bad{background:linear-gradient(180deg,#fff7ea,#fff);border-color:#ffd38a}
.lab-rev-h{font-weight:800;margin:0 4px 8px}
.lab-rev-stage{position:relative}
.lab-rev-f{position:absolute;inset:0;z-index:2;display:grid;place-items:center;font-size:2.8rem;font-weight:800;pointer-events:none;transition:all .55s cubic-bezier(.2,.8,.2,1)}
.lab-rev-stage.anim .lab-rev-f{animation:labfin .5s ease-out both}
.lab-rev-stage.go .lab-rev-f{inset:8px auto auto 10px;font-size:1.25rem;background:rgba(255,255,255,.85);padding:2px 10px;border-radius:999px;box-shadow:0 2px 8px rgba(60,40,140,.12);display:block}
.lab-rev-stage .lab-canvas{transition:opacity .4s}
.lab-rev-stage.anim:not(.go) .lab-canvas{opacity:.15}
@keyframes labfin{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
.lab-rev-bar{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:6px}
.lab-rev-ex{margin:8px 2px 0;font-size:.94rem}
/* אנימציית תגובה */
.lab-rx{background:#fff;border-radius:18px;padding:10px;box-shadow:inset 0 0 0 1px rgba(106,76,224,.12);margin-top:10px}
.lab-rx-eq{text-align:center;font-size:1.3rem;margin-bottom:4px}
.lab-rx-phase{text-align:center;font-weight:700;color:var(--pri,#6a4ce0);min-height:1.5em;font-size:.92rem}
.lab-rx-box{border-radius:14px;background:#fbfaff;padding:6px;margin:6px 0}
.lab-rx-svg{display:block;width:100%;height:auto;max-height:52vh}
.lab-rx-svg .rxl{stroke:#7d7896;stroke-linecap:round}
.lab-rx-svg .breaking .rxl{stroke:#d6455d}
.lab-rx-svg .forming .rxl{stroke:#14966f}
.lab-rx-ctl{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.lab-rx-tbl{width:100%;border-collapse:collapse;margin-top:8px;font-size:.9rem}
.lab-rx-tbl th,.lab-rx-tbl td{padding:5px 6px;border-bottom:1px solid var(--line,#e6e0f5);text-align:center}
.lab-rx-tbl td:first-child{text-align:start;white-space:nowrap}
.lab-rx-tbl i{vertical-align:-2px;margin-inline-end:4px}
.lab-rx-cons{background:var(--okSoft,#e3f7ef);border-radius:12px;padding:8px 10px;margin:8px 0 0;font-size:.9rem}
@media (prefers-reduced-motion:reduce){.lab-card,.lab-rev-f,.lab-rev-stage .lab-canvas{animation:none!important;transition:none!important}.lab-spin{animation-duration:2s}}
.lab [hidden],.lab-rev [hidden],.lab-rx [hidden]{display:none!important}
.lab-ch .lab-canvas{height:clamp(240px,42vh,380px)}

/* מקדם: n מולקולות נפרדות בהמחשה */
.lab-rev-many{background:#fff;border:1px solid #e3dbff;border-radius:14px;padding:8px;margin-bottom:8px}
.lab-many{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px 14px;direction:ltr}
.lab-one{display:inline-flex;padding:4px;border-radius:12px;background:#f7f4ff;border:1px dashed #d4c8fb}
.lab-one svg{display:block;max-width:100%;height:auto}
.lab-many-t{text-align:center;margin:6px 0 0}
.lab-one-of{position:absolute;bottom:8px;inset-inline-start:10px;z-index:2;background:rgba(255,255,255,.9);border-radius:999px;padding:2px 10px;font-size:.85rem;font-weight:700;color:#5b45c9;box-shadow:0 2px 8px rgba(60,40,140,.12)}
.lab-fallback .lab-many{padding:44px 8px 8px}
.lab-ndesc{flex-basis:100%;font-size:.86rem;font-weight:500;color:#5d5878;margin-top:4px;line-height:1.45}
