/* ════════════════════════════════════════════════════════════════
   Lab Guide — advanced in-lab support system (CT-GUIDE 2026-07-03)
   Spotlight tour · live-verified playbooks · searchable help drawer.
   React Flow skin: white, #ff0071, soft cards, dot grid.
   ════════════════════════════════════════════════════════════════ */
.lg-fab{position:fixed;left:20px;bottom:20px;z-index:8000;display:flex;align-items:center;gap:9px;
  background:#0a0a0c;color:#fff;border:none;border-radius:999px;padding:11px 18px;font-weight:750;font-size:.9rem;
  font-family:'Inter',sans-serif;cursor:pointer;box-shadow:0 10px 30px rgba(10,10,12,.28);transition:transform .25s cubic-bezier(.16,1,.3,1),box-shadow .25s}
.lg-fab:hover{transform:translateY(-2px);box-shadow:0 16px 40px rgba(255,0,113,.32)}
.lg-fab .lg-spark{width:22px;height:22px;border-radius:50%;background:linear-gradient(135deg,#ff0071,#7c3aed);display:grid;place-items:center;font-size:.8rem}
.lg-fab.pulse::after{content:"";position:absolute;inset:-4px;border-radius:999px;border:2px solid rgba(255,0,113,.5);animation:lgPulse 1.8s ease-out infinite}
@keyframes lgPulse{0%{opacity:.8;transform:scale(1)}100%{opacity:0;transform:scale(1.35)}}
.lg-fab .lg-badge{background:#ff0071;color:#fff;font-size:.64rem;font-weight:800;border-radius:999px;padding:1px 7px;margin-left:2px}

/* ── drawer ── */
.lg-scrim{position:fixed;inset:0;z-index:8900;background:rgba(10,10,12,.35);backdrop-filter:blur(2px);opacity:0;pointer-events:none;transition:opacity .3s}
.lg-scrim.open{opacity:1;pointer-events:auto}
.lg-drawer{position:fixed;top:0;right:0;height:100%;width:min(430px,94vw);z-index:9000;background:#fff;
  box-shadow:-16px 0 50px rgba(10,10,12,.18);transform:translateX(102%);transition:transform .38s cubic-bezier(.16,1,.3,1);
  display:flex;flex-direction:column;font-family:'Inter',sans-serif;color:#0a0a0c}
.lg-drawer.open{transform:none}
.lg-head{padding:18px 20px 14px;border-bottom:1px solid #eee;display:flex;align-items:center;gap:10px}
.lg-head h3{font-size:1.05rem;font-weight:850;letter-spacing:-.02em;flex:1}
.lg-head .lg-x{border:none;background:#f4f4f6;width:30px;height:30px;border-radius:9px;cursor:pointer;color:#52525b;font-size:1rem}
.lg-head .lg-x:hover{background:#ff0071;color:#fff}
.lg-body{flex:1;overflow-y:auto;padding:16px 18px 40px}
.lg-back{display:inline-flex;align-items:center;gap:6px;background:none;border:none;color:#ff0071;font-weight:700;font-size:.82rem;cursor:pointer;margin-bottom:12px;padding:0}

/* ── home cards ── */
.lg-hero{background:linear-gradient(135deg,rgba(255,0,113,.08),rgba(124,58,237,.07));border:1px solid #f0e0ea;border-radius:16px;padding:16px;margin-bottom:16px}
.lg-hero h4{font-size:1rem;font-weight:800;margin-bottom:4px}
.lg-hero p{font-size:.84rem;color:#52525b;line-height:1.5}
.lg-sec-t{font-family:'JetBrains Mono',monospace;font-size:.64rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:#9c9ca6;margin:18px 2px 8px}
.lg-card{display:flex;gap:12px;align-items:flex-start;width:100%;text-align:left;background:#fff;border:1px solid #e8e8ee;border-radius:14px;padding:13px 14px;cursor:pointer;transition:border-color .2s,box-shadow .2s,transform .2s;margin-bottom:9px;font-family:inherit}
.lg-card:hover{border-color:#ff0071;box-shadow:0 6px 18px rgba(255,0,113,.1);transform:translateY(-1px)}
.lg-card .lg-ic{width:36px;height:36px;flex:none;border-radius:10px;display:grid;place-items:center;font-size:1rem}
.lg-card .lg-t{font-weight:750;font-size:.92rem;letter-spacing:-.01em}
.lg-card .lg-d{font-size:.78rem;color:#6b6b76;line-height:1.45;margin-top:2px}
.lg-card .lg-meta{display:flex;gap:8px;margin-top:6px;flex-wrap:wrap}
.lg-chip{font-size:.66rem;font-weight:700;border-radius:999px;padding:2px 9px}
.lg-chip.lvl1{background:rgba(16,185,129,.12);color:#0c8a61}
.lg-chip.lvl2{background:rgba(245,158,11,.14);color:#b45309}
.lg-chip.lvl3{background:rgba(124,58,237,.12);color:#6d28d9}
.lg-chip.min{background:#f4f4f6;color:#6b6b76}
.lg-card.done{border-color:rgba(16,185,129,.4);background:rgba(16,185,129,.04)}
.lg-card.done .lg-t::after{content:" ✓";color:#0c8a61}

/* ── playbook runner ── */
.lg-pb-head{margin-bottom:14px}
.lg-pb-head h4{font-size:1.05rem;font-weight:850;letter-spacing:-.02em}
.lg-pb-head p{font-size:.82rem;color:#6b6b76;margin-top:4px;line-height:1.5}
.lg-prog{height:6px;border-radius:99px;background:#f0f0f4;overflow:hidden;margin:12px 0}
.lg-prog i{display:block;height:100%;width:0;background:linear-gradient(90deg,#ff0071,#7c3aed);transition:width .5s cubic-bezier(.16,1,.3,1)}
.lg-step{border:1px solid #e8e8ee;border-radius:14px;padding:0;margin-bottom:10px;overflow:hidden;transition:border-color .3s}
.lg-step.active{border-color:#ff0071;box-shadow:0 6px 20px rgba(255,0,113,.1)}
.lg-step.done{border-color:rgba(16,185,129,.35);background:rgba(16,185,129,.03)}
.lg-step-h{display:flex;align-items:center;gap:10px;padding:13px 14px;cursor:pointer}
.lg-step-n{width:24px;height:24px;flex:none;border-radius:50%;display:grid;place-items:center;font-size:.76rem;font-weight:800;background:#f0f0f4;color:#6b6b76}
.lg-step.active .lg-step-n{background:#ff0071;color:#fff}
.lg-step.done .lg-step-n{background:#10b981;color:#fff}
.lg-step-t{font-weight:700;font-size:.88rem;flex:1}
.lg-step-body{padding:0 14px 14px 48px;font-size:.83rem;color:#3a3a42;line-height:1.55;display:none}
.lg-step.active .lg-step-body{display:block}
.lg-step-body .lg-do{background:#faf7f9;border:1px solid #f0e0ea;border-radius:10px;padding:9px 11px;margin:4px 0 8px}
.lg-step-body .lg-do b{color:#d60060}
.lg-step-body .lg-why{color:#6b6b76;font-size:.79rem;font-style:italic;border-left:2px solid #e4e4e9;padding-left:9px;margin-top:6px}
.lg-verify{display:flex;align-items:center;gap:8px;margin-top:10px;font-family:'JetBrains Mono',monospace;font-size:.74rem}
.lg-verify .dot{width:9px;height:9px;border-radius:50%;background:#d6d6dd}
.lg-verify.wait .dot{background:#f59e0b;animation:lgBlink 1s infinite}
.lg-verify.ok .dot{background:#10b981}
@keyframes lgBlink{50%{opacity:.3}}
.lg-ackbtn{margin-top:8px;background:#0a0a0c;color:#fff;border:none;border-radius:999px;padding:7px 16px;font-weight:700;font-size:.8rem;cursor:pointer}
.lg-ackbtn:hover{background:#ff0071}
.lg-pb-done{text-align:center;padding:20px;background:linear-gradient(135deg,rgba(255,0,113,.07),rgba(124,58,237,.06));border-radius:16px;margin-top:8px}
.lg-pb-done .big{font-size:1.8rem}

/* ── help / glossary ── */
.lg-search{width:100%;border:1px solid #e4e4e9;border-radius:12px;padding:11px 14px;font-size:.9rem;font-family:inherit;margin-bottom:6px}
.lg-search:focus{outline:none;border-color:#ff0071;box-shadow:0 0 0 3px rgba(255,0,113,.12)}
.lg-term{border-bottom:1px solid #f0f0f4;padding:11px 2px}
.lg-term .k{font-weight:750;font-size:.88rem}
.lg-term .k small{font-family:'JetBrains Mono',monospace;font-weight:600;color:#9c9ca6;font-size:.7rem;margin-left:6px}
.lg-term .v{font-size:.82rem;color:#52525b;line-height:1.5;margin-top:3px}
.lg-term .spec{font-family:'JetBrains Mono',monospace;font-size:.68rem;color:#7c3aed;margin-top:3px}

/* ── spotlight tour ── */
.lg-tour-scrim{position:fixed;inset:0;z-index:9400;pointer-events:auto}
.lg-spot{position:fixed;z-index:9401;border-radius:14px;box-shadow:0 0 0 9999px rgba(10,10,12,.62);transition:all .4s cubic-bezier(.16,1,.3,1);pointer-events:none;border:2px solid #ff0071}
.lg-tip{position:fixed;z-index:9402;width:min(330px,86vw);background:#fff;border-radius:16px;box-shadow:0 24px 60px rgba(10,10,12,.35);padding:16px 18px;font-family:'Inter',sans-serif;transition:all .4s cubic-bezier(.16,1,.3,1)}
.lg-tip .step-of{font-family:'JetBrains Mono',monospace;font-size:.64rem;font-weight:700;letter-spacing:.14em;color:#ff0071;text-transform:uppercase}
.lg-tip h4{font-size:1rem;font-weight:800;margin:5px 0 6px;letter-spacing:-.02em}
.lg-tip p{font-size:.85rem;color:#52525b;line-height:1.55}
.lg-tip-nav{display:flex;align-items:center;gap:8px;margin-top:14px}
.lg-tip-nav .dots{display:flex;gap:5px;flex:1}
.lg-tip-nav .dots i{width:6px;height:6px;border-radius:50%;background:#e0e0e6}
.lg-tip-nav .dots i.on{background:#ff0071;width:16px;border-radius:99px}
.lg-tip-nav button{border:none;border-radius:999px;padding:7px 15px;font-weight:700;font-size:.8rem;cursor:pointer;font-family:inherit}
.lg-tip-nav .skip{background:none;color:#9c9ca6;padding:7px 8px}
.lg-tip-nav .next{background:#0a0a0c;color:#fff}
.lg-tip-nav .next:hover{background:#ff0071}
@media(max-width:600px){.lg-fab span.lg-txt{display:none}.lg-fab{padding:12px}}