@import"https://fonts.googleapis.com/css2?family=Syne:wght@400;600;800&family=JetBrains+Mono:wght@400;600&display=swap";.live-lab{display:grid;grid-template-columns:1fr 320px;gap:20px;max-width:1400px;margin:20px auto;padding:0 20px;height:calc(100vh - 100px);font-family:Syne,sans-serif}@media(max-width:960px){.live-lab{grid-template-columns:1fr;height:auto}}.live-camera-frame{position:relative;border-radius:20px;overflow:hidden;background:#000;border:2px solid rgba(0,188,212,.3);box-shadow:0 0 40px #00bcd426,0 20px 60px #00000080}.camera-feed{width:100%;height:100%;object-fit:cover;display:block}.hand-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;transform:scaleX(1)}.camera-error{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;padding:40px;text-align:center;color:var(--text-muted)}.camera-error-icon{font-size:3rem;margin-bottom:16px;opacity:.5}.hud-top{position:absolute;top:16px;left:16px;right:16px;display:flex;align-items:center;justify-content:space-between;z-index:10;pointer-events:none}.hud-badge{padding:6px 14px;background:#00bcd4d9;color:#fff;font-size:.75rem;font-weight:700;letter-spacing:.08em;border-radius:999px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:hudPulse 2s ease-in-out infinite;font-family:JetBrains Mono,monospace}@keyframes hudPulse{0%,to{box-shadow:0 0 12px #00bcd466}50%{box-shadow:0 0 24px #00bcd4b3}}.hud-status{padding:6px 14px;background:#0009;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:999px;font-size:.78rem;font-weight:500;color:#90a4ae;display:flex;align-items:center;gap:8px;font-family:Syne,sans-serif}.hud-status-dot{width:8px;height:8px;border-radius:50%;background:#64748b}.hud-status.waiting .hud-status-dot{background:#64748b}.hud-status.ready .hud-status-dot{background:var(--warning);box-shadow:0 0 8px var(--warning-glow);animation:blink 1s infinite}.hud-status.triggered .hud-status-dot{background:var(--danger);box-shadow:0 0 8px var(--danger-glow);animation:blink .4s infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:.3}}.hud-hint{position:absolute;bottom:24px;left:50%;transform:translate(-50%);padding:10px 24px;background:#000000b3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:999px;font-size:.85rem;color:#90a4ae;white-space:nowrap;z-index:10;animation:fadeSlideUp .4s ease;font-family:Syne,sans-serif}.chemical-overlay{position:absolute;inset:0;pointer-events:none;z-index:5}.chem-label{position:absolute;transform:translate(-50%,-100%);padding:4px 12px;background:#000000bf;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:10px;font-size:.78rem;font-weight:600;color:#fff;white-space:nowrap;display:flex;align-items:center;gap:6px;border:1px solid rgba(255,255,255,.1);transition:left .08s linear,top .08s linear;font-family:Syne,sans-serif}.chem-label.left{border-color:#00bcd480}.chem-label.right{border-color:#22c55e80}.chem-label.assigned{box-shadow:0 0 12px #00bcd44d}.chem-label-hand{font-size:1rem}.chem-label-text{letter-spacing:.03em}.reaction-orb{position:absolute;transform:translate(-50%,-50%);width:80px;height:80px;pointer-events:none;z-index:6;transition:left .08s linear,top .08s linear}.orb-inner{width:100%;height:100%;border-radius:50%;background:radial-gradient(circle,rgba(0,188,212,.25) 0%,transparent 70%);border:2px solid rgba(0,188,212,.3);animation:orbPulse 1.5s ease-in-out infinite}.reaction-orb.mixing .orb-inner{background:radial-gradient(circle,rgba(0,188,212,.5) 0%,rgba(0,188,212,.2) 50%,transparent 70%);border-color:#00bcd499;animation:orbMix .6s ease-in-out infinite}.orb-glow{position:absolute;inset:-20px;border-radius:50%;background:radial-gradient(circle,rgba(0,188,212,.15) 0%,transparent 60%)}@keyframes orbPulse{0%,to{transform:scale(1);opacity:.8}50%{transform:scale(1.1);opacity:1}}@keyframes orbMix{0%,to{transform:scale(1) rotate(0)}25%{transform:scale(1.15) rotate(5deg)}75%{transform:scale(.9) rotate(-5deg)}}.fx-container{position:absolute;inset:0;pointer-events:none;z-index:8;overflow:hidden;border-radius:20px}.fx-container.fading{opacity:0;transition:opacity 1s ease}.fx-shake-heavy{animation:fxShakeHeavy .6s ease-in-out}.fx-shake-light{animation:fxShakeLight .3s ease-in-out}@keyframes fxShakeHeavy{0%,to{transform:translate(0) rotate(0)}10%{transform:translate(-8px,4px) rotate(-1deg)}20%{transform:translate(8px,-4px) rotate(1deg)}30%{transform:translate(-6px,-6px) rotate(-.5deg)}40%{transform:translate(6px,6px) rotate(.5deg)}50%{transform:translate(-4px,2px) rotate(-.3deg)}60%{transform:translate(4px,-2px) rotate(.3deg)}70%{transform:translate(-2px,4px)}80%{transform:translate(2px,-2px)}}@keyframes fxShakeLight{0%,to{transform:translate(0)}25%{transform:translate(-3px,2px)}50%{transform:translate(3px,-2px)}75%{transform:translate(-2px,-1px)}}.fx-center-glow{position:absolute;transform:translate(-50%,-50%);width:0;height:0}.fx-glow-core{position:absolute;width:60px;height:60px;border-radius:50%;transform:translate(-50%,-50%);animation:fxGlowPulse 1.5s ease-in-out infinite}.fx-safe-glow .fx-glow-core{background:radial-gradient(circle,rgba(34,197,94,.8) 0%,rgba(34,197,94,.3) 40%,transparent 70%);box-shadow:0 0 40px #22c55e99,0 0 80px #22c55e4d}.fx-moderate-glow .fx-glow-core{background:radial-gradient(circle,rgba(245,158,11,.8) 0%,rgba(245,158,11,.3) 40%,transparent 70%);box-shadow:0 0 40px #f59e0b99,0 0 80px #f59e0b4d}.fx-glow-ring{position:absolute;border-radius:50%;transform:translate(-50%,-50%);border:2px solid;animation:fxRingExpand 2s ease-out infinite}.fx-safe-glow .fx-glow-ring{border-color:#22c55e80}.fx-moderate-glow .fx-glow-ring{border-color:#f59e0b80}.fx-glow-ring.ring-1{width:40px;height:40px;animation-delay:0s}.fx-glow-ring.ring-2{width:40px;height:40px;animation-delay:.5s}.fx-glow-ring.ring-3{width:40px;height:40px;animation-delay:1s}@keyframes fxGlowPulse{0%,to{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-50%) scale(1.3)}}@keyframes fxRingExpand{0%{transform:translate(-50%,-50%) scale(1);opacity:.8}to{transform:translate(-50%,-50%) scale(5);opacity:0;border-width:.5px}}.fx-particle{position:absolute;border-radius:50%;transform:translate(-50%,-50%);animation:fxParticleFly 1.5s ease-out forwards;opacity:0}@keyframes fxParticleFly{0%{transform:translate(-50%,-50%) scale(1);opacity:1}20%{opacity:1}to{transform:translate(calc(-50% + var(--dx, 0px)),calc(-50% + var(--dy, 0px))) scale(0);opacity:0}}.fx-sparkle{background:radial-gradient(circle,#4ade80 30%,#22c55e 60%,transparent 70%);box-shadow:0 0 6px #22c55ecc;animation-name:fxSparkleFly}@keyframes fxSparkleFly{0%{transform:translate(-50%,-50%) scale(0);opacity:0}10%{transform:translate(-50%,-50%) scale(1.2);opacity:1}30%{opacity:1}to{transform:translate(calc(-50% + var(--dx, 0px)),calc(-50% + var(--dy, 0px))) scale(0);opacity:0}}.fx-bubble{position:absolute;width:var(--size, 10px);height:var(--size, 10px);border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff6,#22c55e26);border:1px solid rgba(34,197,94,.3);transform:translate(-50%,-50%);animation:fxBubbleFloat 3s ease-in-out var(--delay, 0s) forwards}@keyframes fxBubbleFloat{0%{opacity:0;transform:translate(-50%,-50%) scale(0)}15%{opacity:.8;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(calc(-50% + var(--drift, 20px)),calc(-50% - 120px)) scale(.5)}}.fx-smoke-cloud{position:absolute;width:var(--size, 30px);height:var(--size, 30px);border-radius:50%;background:radial-gradient(circle,rgba(148,163,184,.5) 0%,rgba(100,116,139,.2) 50%,transparent 70%);transform:translate(-50%,-50%);animation:fxSmokeDrift 2s ease-out forwards;filter:blur(4px)}@keyframes fxSmokeDrift{0%{opacity:0;transform:translate(-50%,-50%) scale(.3)}20%{opacity:.7}to{opacity:0;transform:translate(calc(-50% + var(--driftX, 30px)),calc(-50% + var(--driftY, -60px))) scale(2)}}.fx-spark{background:radial-gradient(circle,#fbbf24 30%,#f59e0b 60%,transparent 70%);box-shadow:0 0 8px #f59e0bcc;animation-name:fxSparkFly}@keyframes fxSparkFly{0%{transform:translate(-50%,-50%) scale(0);opacity:0}5%{transform:translate(-50%,-50%) scale(1);opacity:1}to{transform:translate(calc(-50% + var(--dx, 0px)),calc(-50% + var(--dy, 0px))) scale(0);opacity:0}}.fx-steam-jet{position:absolute;width:6px;transform:translate(-50%,-50%);animation:fxSteamRise 1.5s ease-out var(--delay, 0s) forwards}.fx-steam-jet:before{content:"";display:block;width:8px;height:8px;border-radius:50%;background:#ffffff4d;filter:blur(3px)}@keyframes fxSteamRise{0%{opacity:0;transform:translate(-50%) scale(.5)}20%{opacity:.6}to{opacity:0;transform:translate(-50%,-100px) scale(2)}}.fx-white-flash{position:absolute;inset:0;background:#ffffffe6;border-radius:20px;animation:fxFlashOut .3s ease-out forwards;z-index:20}@keyframes fxFlashOut{0%{opacity:1}to{opacity:0}}.fx-fireball{position:absolute;transform:translate(-50%,-50%);width:0;height:0}.fx-fireball-inner{position:absolute;width:80px;height:80px;border-radius:50%;transform:translate(-50%,-50%);background:radial-gradient(circle,#fff 0%,#fbbf24 25%,#ef4444 55%,transparent 70%);box-shadow:0 0 60px #ef4444cc,0 0 120px #f59e0b80;animation:fxFireballPulse .8s ease-out forwards}.fx-fireball-outer{position:absolute;width:160px;height:160px;border-radius:50%;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(239,68,68,.3) 0%,rgba(245,158,11,.1) 40%,transparent 60%);animation:fxFireballExpand 1.5s ease-out forwards}@keyframes fxFireballPulse{0%{transform:translate(-50%,-50%) scale(0);opacity:0}15%{transform:translate(-50%,-50%) scale(1.5);opacity:1}50%{transform:translate(-50%,-50%) scale(1.2);opacity:.8}to{transform:translate(-50%,-50%) scale(.3);opacity:0}}@keyframes fxFireballExpand{0%{transform:translate(-50%,-50%) scale(.3);opacity:0}15%{opacity:.8}to{transform:translate(-50%,-50%) scale(3);opacity:0}}.fx-shockwave{position:absolute;transform:translate(-50%,-50%);width:0;height:0}.fx-shock-ring{position:absolute;width:40px;height:40px;border-radius:50%;border:3px solid rgba(239,68,68,.7);transform:translate(-50%,-50%);animation:fxShockExpand 1.5s ease-out forwards}.fx-shock-ring.ring-1{animation-delay:0s;border-color:#ffffff80}.fx-shock-ring.ring-2{animation-delay:.2s;border-color:#ef444480}.fx-shock-ring.ring-3{animation-delay:.4s;border-color:#f59e0b66}@keyframes fxShockExpand{0%{transform:translate(-50%,-50%) scale(.5);opacity:1}to{transform:translate(-50%,-50%) scale(15);opacity:0;border-width:.5px}}.fx-debris{border-radius:2px;background:linear-gradient(135deg,#ef4444,#fbbf24);box-shadow:0 0 4px #ef4444cc,0 0 8px #f59e0b80;animation-name:fxDebrisFly}@keyframes fxDebrisFly{0%{transform:translate(-50%,-50%) scale(0) rotate(0);opacity:0}8%{transform:translate(-50%,-50%) scale(1) rotate(45deg);opacity:1}to{transform:translate(calc(-50% + var(--dx, 0px)),calc(-50% + var(--dy, 0px))) scale(0) rotate(720deg);opacity:0}}.fx-ember{position:absolute;width:4px;height:4px;border-radius:50%;background:#fbbf24;box-shadow:0 0 6px #ef4444,0 0 12px #fbbf24;transform:translate(-50%,-50%);animation:fxEmberFly 2s ease-out var(--delay, 0s) forwards}@keyframes fxEmberFly{0%{opacity:0;transform:translate(-50%,-50%) scale(0)}10%{opacity:1;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(calc(-50% + var(--dx, 0px)),calc(-50% + var(--dy, 0px))) scale(0)}}.fx-danger-overlay{position:absolute;inset:0;border-radius:20px;background:transparent;box-shadow:inset 0 0 80px #ef44444d;animation:fxDangerPulse 2s ease-in-out}@keyframes fxDangerPulse{0%{box-shadow:inset 0 0 80px #ef444480}30%{box-shadow:inset 0 0 120px #ef444433}60%{box-shadow:inset 0 0 60px #ef44444d}to{box-shadow:inset 0 0 0 transparent}}.fx-text{position:absolute;transform:translate(-50%,-50%);font-size:.9rem;font-weight:700;letter-spacing:.03em;text-shadow:0 2px 8px rgba(0,0,0,.6);animation:fxTextFloat 3s ease-out forwards;white-space:nowrap;z-index:10}.fx-text-safe{color:#4ade80}.fx-text-moderate{color:#fbbf24}.fx-text-danger{color:#ef4444;font-size:1.1rem}@keyframes fxTextFloat{0%{opacity:0;transform:translate(-50%,-50%) scale(.5)}15%{opacity:1;transform:translate(-50%,-50%) scale(1.1)}30%{transform:translate(-50%,-50%) scale(1)}70%{opacity:1}to{opacity:0;transform:translate(-50%,calc(-50% - 40px)) scale(.8)}}.live-sidebar{display:flex;flex-direction:column;gap:14px;overflow-y:auto;max-height:calc(100vh - 100px)}.live-sidebar::-webkit-scrollbar{width:6px}.live-sidebar::-webkit-scrollbar-track{background:#0003}.live-sidebar::-webkit-scrollbar-thumb{background:#00bcd44d;border-radius:3px}.live-sidebar::-webkit-scrollbar-thumb:hover{background:#00bcd480}.live-panel{padding:16px;font-family:Syne,sans-serif;background:linear-gradient(160deg,#0a1929,#071520,#0a1929);border:1px solid rgba(0,188,212,.12);border-radius:16px;position:relative;overflow:hidden;box-shadow:0 20px 60px #00000080,inset 0 1px #ffffff0a}.live-panel:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(0,188,212,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(0,188,212,.03) 1px,transparent 1px);background-size:40px 40px;pointer-events:none}.live-panel-title{font-size:.85rem;font-weight:700;margin-bottom:12px;color:#e0f7fa;position:relative;z-index:1;letter-spacing:.3px}.live-select{width:100%;padding:10px 14px;background:#ffffff0a;border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-xs);color:var(--text-primary);font-family:var(--font);font-size:.84rem;appearance:none;cursor:pointer;outline:none;transition:var(--transition)}.live-select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}.live-select option{background:#1e293b;color:#f1f5f9}.status-grid{display:grid;gap:8px;position:relative;z-index:1}.status-item{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;background:#00bcd40a;border-radius:8px;border:1px solid rgba(0,188,212,.12)}.status-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.06em;color:#546e7a;font-weight:600;font-family:JetBrains Mono,monospace}.status-value{font-size:.82rem;font-weight:600;color:#cfd8dc}.state-waiting{color:#546e7a}.state-ready{color:#eab308}.state-triggered{color:#ef4444}.live-result{animation:fadeSlideUp .5s ease;position:relative;z-index:1}.live-equation{font-size:.88rem;font-weight:600;color:#00bcd4;padding:8px 12px;background:#00bcd414;border-radius:8px;margin-bottom:10px;text-align:center;font-family:JetBrains Mono,monospace}.live-message{font-size:.82rem;color:#90a4ae;line-height:1.5;margin-bottom:8px}.live-teacher{margin-top:10px;padding:10px 12px;background:#00bcd40f;border:1px solid rgba(0,188,212,.2);border-radius:8px}.live-teacher-label{display:block;font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:#00bcd4;margin-bottom:6px;font-family:JetBrains Mono,monospace}.live-teacher p{font-size:.82rem;color:#90a4ae;line-height:1.5}.hud-lighting-hint{position:absolute;bottom:60px;left:50%;transform:translate(-50%);padding:6px 16px;background:#0000008c;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:999px;font-size:.72rem;color:#546e7a;white-space:nowrap;z-index:9;pointer-events:none;opacity:.7;font-family:Syne,sans-serif}.quality-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-left:8px;vertical-align:middle}.q-stable{background:#22c55e;box-shadow:0 0 6px #22c55e66}.q-weak{background:#eab308;box-shadow:0 0 6px #eab30866}.q-lost{background:#ef4444;box-shadow:0 0 6px #ef444466}.debug-toggle{display:flex;align-items:center;gap:10px;cursor:pointer;-webkit-user-select:none;user-select:none;font-family:Syne,sans-serif}.debug-toggle input{display:none}.toggle-label{font-family:Syne,sans-serif}.debug-panel{position:absolute;bottom:16px;left:16px;padding:12px 16px;background:#000c;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:12px;border:1px solid rgba(255,255,255,.1);z-index:20;min-width:160px;font-family:JetBrains Mono,monospace;animation:fadeSlideUp .3s ease}.debug-title{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:#00bcd4;margin-bottom:8px;border-bottom:1px solid rgba(255,255,255,.1);padding-bottom:6px}.debug-row{display:flex;justify-content:space-between;gap:12px;font-size:.72rem;padding:2px 0;color:#90a4ae;font-family:JetBrains Mono,monospace}.debug-row span:first-child{color:#546e7a}.debug-good{color:#22c55e!important}.debug-warn{color:#eab308!important}.debug-bad{color:#ef4444!important}.debug-q-stable{color:#22c55e!important}.debug-q-weak{color:#eab308!important}.debug-q-lost{color:#ef4444!important}.mistake-overlay{position:absolute;top:60px;left:16px;right:16px;z-index:15;display:flex;flex-direction:column;gap:8px;pointer-events:none}.mistake-overlay>*{pointer-events:auto}.mistake-shake{animation:mistakeShake .4s ease-in-out}@keyframes mistakeShake{0%,to{transform:translate(0)}20%{transform:translate(-6px)}40%{transform:translate(6px)}60%{transform:translate(-4px)}80%{transform:translate(4px)}}.mistake-card{display:flex;align-items:flex-start;gap:10px;padding:10px 14px;border-radius:12px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);animation:fadeSlideUp .3s ease;font-family:Syne,sans-serif}.mistake-card.warning{background:#eab3081f;border:1px solid rgba(234,179,8,.35)}.mistake-card.info{background:#00bcd41a;border:1px solid rgba(0,188,212,.25)}.mistake-card-icon{font-size:1.1rem;flex-shrink:0;margin-top:1px}.mistake-card-body{flex:1}.mistake-msg{font-size:.8rem;font-weight:500;color:#e0f7fa;margin:0 0 4px;font-family:Syne,sans-serif}.mistake-advice{font-size:.74rem;color:#90a4ae;margin:0;font-family:Syne,sans-serif}.mistake-dismiss{background:transparent;border:none;color:var(--text-muted);cursor:pointer;font-size:.85rem;padding:2px 6px;opacity:.6;transition:opacity .2s}.mistake-dismiss:hover{opacity:1}.mistake-suggestions{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}.sugg-label{font-size:.68rem;color:#546e7a;margin-right:2px;font-family:Syne,sans-serif}.sugg-chip{font-size:.7rem;font-weight:600;padding:2px 8px;border-radius:999px;background:#00bcd426;color:#00bcd4;border:1px solid rgba(0,188,212,.25)}.mistake-modal.danger{display:flex;align-items:flex-start;gap:12px;padding:14px 18px;border-radius:14px;background:#ef444426;border:1px solid rgba(239,68,68,.4);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);animation:fadeSlideUp .3s ease;box-shadow:0 0 20px #ef444426}.mistake-modal-icon{font-size:1.3rem}.mistake-modal-content{flex:1}.mistake-item{margin-bottom:6px}.mistake-item:last-child{margin-bottom:0}.hud-status.blocked{color:var(--danger)}.hud-status.blocked .hud-status-dot{background:var(--danger);box-shadow:0 0 8px var(--danger-glow);animation:blink .5s infinite}.mistake-log{padding:16px}.mlog-header{display:flex;justify-content:space-between;align-items:flex-start}.mlog-stats{display:flex;gap:6px}.mlog-stat{font-size:.65rem;font-weight:600;padding:2px 8px;border-radius:999px;background:#ffffff0f;color:var(--text-muted)}.mlog-stat.danger{background:#ef44441f;color:var(--danger)}.mlog-stat.warning{background:#eab3081f;color:var(--warning)}.mlog-empty{font-size:.8rem;color:#546e7a;text-align:center;padding:16px 0;font-family:Syne,sans-serif}.mlog-list{display:flex;flex-direction:column;gap:6px;max-height:200px;overflow-y:auto}.mlog-list::-webkit-scrollbar{width:3px}.mlog-list::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:999px}.mlog-entry{display:flex;gap:8px;padding:8px 10px;background:#ffffff08;border-radius:8px;border:1px solid rgba(0,188,212,.08);font-size:.75rem;font-family:Syne,sans-serif}.mlog-entry.danger{border-color:#ef444440}.mlog-entry.warning{border-color:#eab30840}.mlog-icon{flex-shrink:0}.mlog-body{flex:1}.mlog-type{font-weight:600;color:#e0f7fa;text-transform:capitalize;font-family:Syne,sans-serif}.mlog-time{font-size:.65rem;color:#546e7a;margin-left:8px;font-family:JetBrains Mono,monospace}.mlog-msg{color:#90a4ae;margin:2px 0 0;font-family:Syne,sans-serif}.mlog-clear{width:100%;margin-top:8px;padding:6px;background:#ffffff0a;border:1px solid rgba(0,188,212,.08);border-radius:8px;color:#546e7a;font-family:Syne,sans-serif;font-size:.72rem;cursor:pointer;transition:all .2s}.mlog-clear:hover{border-color:#ef4444;color:#ef4444}.test-tube-container{position:absolute;transform:translate(-50%,-50%);pointer-events:none;z-index:7;display:flex;flex-direction:column;align-items:center;gap:8px;will-change:left,top;filter:drop-shadow(0 8px 16px rgba(0,0,0,.4))}.test-tube{position:relative;width:45px;height:110px;display:flex;flex-direction:column;align-items:center;animation:testTubeFloat 2s ease-in-out infinite}@keyframes testTubeFloat{0%,to{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-4px) rotate(1deg)}}.tube-cork{width:36px;height:14px;background:linear-gradient(180deg,sienna,#8b4513,#654321);border-radius:5px 5px 2px 2px;position:relative;z-index:3;box-shadow:0 2px 4px #0006,inset 0 1px 2px #8b45134d,inset 0 -1px 1px #0000004d}.tube-cork:before{content:"";position:absolute;inset:2px;background:repeating-linear-gradient(90deg,transparent,transparent 2px,rgba(0,0,0,.1) 2px,rgba(0,0,0,.1) 3px);border-radius:3px 3px 1px 1px}.tube-glass{position:relative;width:40px;height:96px;background:linear-gradient(90deg,#dcebf540,#f0f8ff26 20%,#ffffff14,#f0f8ff26 80%,#dcebf540);border-left:2px solid rgba(200,220,240,.5);border-right:2px solid rgba(200,220,240,.5);border-bottom:2px solid rgba(200,220,240,.6);border-radius:0 0 20px 20px;overflow:hidden;-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);box-shadow:inset 3px 0 6px #fff6,inset -3px 0 6px #00000026,inset 0 -3px 8px #0000001a,0 4px 12px #0000004d}.tube-glass:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.3) 0%,transparent 30%,transparent 70%,rgba(255,255,255,.15) 100%);pointer-events:none;z-index:4;border-radius:0 0 18px 18px}.tube-liquid{position:absolute;bottom:0;left:0;right:0;height:70%;border-radius:0 0 18px 18px;opacity:.9;animation:liquidBubble 3s ease-in-out infinite;box-shadow:inset 0 3px 8px #00000040,inset 0 -2px 4px #ffffff26;z-index:1}.tube-liquid:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.5) 30%,rgba(255,255,255,.7) 50%,rgba(255,255,255,.5) 70%,transparent 100%);animation:liquidSurfaceShimmer 2.5s ease-in-out infinite;z-index:2}@keyframes liquidSurfaceShimmer{0%,to{opacity:.6}50%{opacity:1}}.tube-liquid:after{content:"";position:absolute;top:10%;left:6px;width:10px;height:60%;background:linear-gradient(to bottom,rgba(255,255,255,.4) 0%,rgba(255,255,255,.2) 50%,transparent 100%);border-radius:50%;filter:blur(2px);z-index:2}@keyframes liquidBubble{0%,to{height:70%}50%{height:72%}}.tube-shine{position:absolute;top:15%;left:10%;width:8px;height:50%;background:linear-gradient(180deg,rgba(255,255,255,.7) 0%,rgba(255,255,255,.4) 30%,rgba(255,255,255,.2) 60%,transparent 100%);border-radius:999px;pointer-events:none;z-index:3;filter:blur(1px)}.tube-shine:after{content:"";position:absolute;top:20%;left:16px;width:4px;height:40%;background:linear-gradient(180deg,rgba(255,255,255,.4) 0%,rgba(255,255,255,.2) 50%,transparent 100%);border-radius:999px;filter:blur(1px)}.tube-label{position:absolute;bottom:25%;left:50%;transform:translate(-50%);padding:3px 8px;background:#000000d9;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:8px;border:1px solid rgba(255,255,255,.25);z-index:4;box-shadow:0 2px 8px #0006,inset 0 1px 1px #ffffff1a}.tube-label-text{font-size:.7rem;font-weight:700;color:#fff;white-space:nowrap;letter-spacing:.05em;text-shadow:0 1px 3px rgba(0,0,0,.8),0 0 8px rgba(255,255,255,.3)}.hand-indicator{font-size:1.3rem;filter:drop-shadow(0 2px 6px rgba(0,0,0,.5));animation:handPulse 1.5s ease-in-out infinite}@keyframes handPulse{0%,to{transform:scale(1);opacity:.9}50%{transform:scale(1.1);opacity:1}}:root{--bg-primary: #0a0e1a;--bg-secondary: #111827;--bg-card: rgba(17, 24, 39, .65);--border-glass: rgba(255, 255, 255, .06);--text-primary: #f1f5f9;--text-secondary: #94a3b8;--text-muted: #64748b;--accent: #6366f1;--accent-glow: rgba(99, 102, 241, .35);--success: #22c55e;--success-glow: rgba(34, 197, 94, .3);--warning: #eab308;--warning-glow: rgba(234, 179, 8, .3);--danger: #ef4444;--danger-glow: rgba(239, 68, 68, .35);--radius: 16px;--radius-sm: 10px;--radius-xs: 6px;--transition: .3s cubic-bezier(.4, 0, .2, 1);--font: "Inter", system-ui, -apple-system, sans-serif;--shadow-lg: 0 20px 60px rgba(0, 0, 0, .45)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;scroll-behavior:smooth}body{font-family:var(--font);background:var(--bg-primary);color:var(--text-primary);overflow-x:hidden;position:relative;display:flex;flex-direction:column;min-height:100vh}#root{display:flex;flex-direction:column;min-height:100vh}.particles{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}.particle{position:absolute;bottom:-10px;background:var(--accent);border-radius:50%;opacity:0;animation:float-particle linear infinite}@keyframes float-particle{0%{opacity:0;transform:translateY(0) scale(1)}10%{opacity:.6}90%{opacity:.3}to{opacity:0;transform:translateY(-100vh) scale(.3)}}.glass-card{background:var(--bg-card);backdrop-filter:blur(24px) saturate(1.4);-webkit-backdrop-filter:blur(24px) saturate(1.4);border:1px solid var(--border-glass);border-radius:var(--radius);box-shadow:var(--shadow-lg)}.topbar{position:sticky;top:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:14px 32px;background:#0a0e1ad1;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-bottom:1px solid var(--border-glass)}.topbar-left{display:flex;align-items:center;gap:12px}.logo{display:flex;align-items:center;gap:8px;font-size:1.35rem;font-weight:700}.logo-icon{font-size:1.5rem}.accent{color:var(--accent)}.badge{font-size:.65rem;font-weight:600;background:var(--accent);color:#fff;padding:2px 8px;border-radius:999px}.teacher-toggle{display:flex;align-items:center;gap:10px;cursor:pointer;-webkit-user-select:none;user-select:none}.teacher-toggle input{display:none}.toggle-slider{position:relative;width:44px;height:24px;background:#334155;border-radius:999px;transition:var(--transition)}.toggle-slider:after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;background:#fff;border-radius:50%;transition:var(--transition)}.teacher-toggle input:checked~.toggle-slider{background:var(--accent)}.teacher-toggle input:checked~.toggle-slider:after{transform:translate(20px)}.toggle-label{font-size:.85rem;font-weight:500;color:var(--text-secondary)}.main-grid{position:relative;z-index:1;display:grid;grid-template-columns:1fr 420px;gap:24px;max-width:1600px;margin:20px auto;padding:0 24px;align-items:stretch}@media(max-width:960px){.main-grid{grid-template-columns:1fr}}.lab-panel{padding:32px}.section-title{font-size:1.1rem;font-weight:600;display:flex;align-items:center;gap:10px;margin-bottom:24px}.dot{width:8px;height:8px;border-radius:50%}.dot.green{background:var(--success);box-shadow:0 0 8px var(--success-glow)}.selector-row{display:flex;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:24px}.selector-group{flex:1;min-width:180px}.selector-group label{display:block;font-size:.8rem;font-weight:500;color:var(--text-secondary);margin-bottom:8px;text-transform:uppercase;letter-spacing:.06em}.custom-select{position:relative}.custom-select select{width:100%;padding:12px 16px;background:#ffffff0a;border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-sm);color:var(--text-primary);font-family:var(--font);font-size:.92rem;appearance:none;cursor:pointer;transition:var(--transition);outline:none}.custom-select select:hover,.custom-select select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}.custom-select:after{content:"▾";position:absolute;right:14px;top:50%;transform:translateY(-50%);color:var(--text-muted);pointer-events:none;font-size:.85rem}.custom-select select option{background:#1e293b;color:#f1f5f9}.plus-sign{font-size:1.6rem;font-weight:300;color:var(--text-muted);padding-bottom:6px}.action-buttons{display:flex;gap:12px;flex-wrap:wrap}.mix-btn{flex:1;min-width:180px;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:14px 36px;background:linear-gradient(135deg,var(--accent),#818cf8);color:#fff;font-family:var(--font);font-size:.95rem;font-weight:600;border:none;border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition);box-shadow:0 4px 24px var(--accent-glow);position:relative;overflow:hidden}.mix-btn:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 40%,rgba(255,255,255,.15) 50%,transparent 60%);transform:translate(-100%);transition:transform .5s}.mix-btn:hover:before{transform:translate(100%)}.mix-btn:hover{transform:translateY(-2px);box-shadow:0 8px 32px var(--accent-glow)}.mix-btn:active{transform:scale(.97)}.mix-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.mix-btn-icon{font-size:1.2rem}.clear-btn{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 24px;background:#ef44441a;color:#ef4444;font-family:var(--font);font-size:.9rem;font-weight:600;border:1px solid rgba(239,68,68,.3);border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition);position:relative;overflow:hidden}.clear-btn:hover{background:#ef444426;border-color:#ef444480;transform:translateY(-2px);box-shadow:0 4px 16px #ef444433}.clear-btn:active{transform:scale(.97)}.clear-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.clear-btn-icon{font-size:1.1rem}.beaker-area{display:flex;justify-content:center;align-items:flex-end;position:relative;height:220px;margin:28px 0 20px}.beaker{position:relative;width:120px;height:160px;border-left:4px solid rgba(200,220,240,.4);border-right:4px solid rgba(200,220,240,.4);border-bottom:4px solid rgba(200,220,240,.5);border-top:none;border-radius:0 0 24px 24px;overflow:hidden;background:linear-gradient(135deg,#ffffff0d,#ffffff05,#ffffff14);box-shadow:inset 4px 0 8px #ffffff26,inset -4px 0 8px #0000001a,0 4px 16px #0000004d}.beaker:before{content:"";position:absolute;top:0;left:8px;width:20px;height:100%;background:linear-gradient(to right,rgba(255,255,255,.3) 0%,rgba(255,255,255,.1) 50%,transparent 100%);pointer-events:none;z-index:10}.beaker:after{content:"";position:absolute;top:0;right:8px;width:12px;height:100%;background:linear-gradient(to left,rgba(255,255,255,.15) 0%,transparent 100%);pointer-events:none;z-index:10}.liquid{position:absolute;bottom:0;left:0;right:0;transition:height .8s cubic-bezier(.4,0,.2,1),background 1s;border-radius:0 0 20px 20px;box-shadow:inset 0 4px 8px #0003,inset 0 -2px 4px #ffffff1a}.liquid-layer{position:absolute;left:0;right:0;transition:height .6s cubic-bezier(.4,0,.2,1),bottom .6s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;justify-content:center;animation:liquidPour .8s ease-out;box-shadow:inset 0 3px 6px #00000026,inset 0 -2px 4px #ffffff1a;overflow:hidden}.liquid-layer:not(.solid-layer):after{content:"";position:absolute;top:-5px;left:-50%;width:200%;height:10px;background:radial-gradient(ellipse at center,rgba(255,255,255,.3) 0%,transparent 70%);animation:liquidWave 2s ease-in-out infinite}@keyframes liquidWave{0%,to{transform:translate(0) scaleY(1)}25%{transform:translate(-10%) scaleY(1.2)}50%{transform:translate(0) scaleY(.8)}75%{transform:translate(10%) scaleY(1.2)}}.solid-layer{background:transparent!important;box-shadow:none}.solid-particles{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:center;padding-bottom:8px}.particle{position:absolute;width:4px;height:4px;border-radius:50%;top:-20px;animation:particleSink 1.5s ease-in forwards;box-shadow:0 1px 2px #0000004d,inset 0 1px 1px #ffffff4d}@keyframes particleSink{0%{top:-20px;opacity:0}10%{opacity:1}to{top:calc(100% - 8px);opacity:1}}.solid-label{position:absolute;bottom:4px;font-size:.7rem;font-weight:700;color:#ffffffe6;text-shadow:0 1px 3px rgba(0,0,0,.8),0 0 8px rgba(0,0,0,.5);letter-spacing:.05em;pointer-events:none;z-index:5;background:#0006;padding:2px 6px;border-radius:4px}.liquid-layer:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.4) 30%,rgba(255,255,255,.6) 50%,rgba(255,255,255,.4) 70%,transparent 100%);animation:surfaceShimmer 3s ease-in-out infinite}@keyframes surfaceShimmer{0%,to{opacity:.5}50%{opacity:.8}}.liquid-layer:after{content:"";position:absolute;top:0;left:8px;width:16px;height:100%;background:linear-gradient(to right,rgba(255,255,255,.25) 0%,rgba(255,255,255,.1) 50%,transparent 100%);pointer-events:none}@keyframes liquidPour{0%{height:0;opacity:0}to{opacity:1}}.liquid-label{font-size:.75rem;font-weight:700;color:#000000b3;text-shadow:0 1px 2px rgba(255,255,255,.5),0 -1px 1px rgba(0,0,0,.3);letter-spacing:.05em;pointer-events:none;z-index:5;filter:drop-shadow(0 1px 1px rgba(255,255,255,.3))}.separation-line{position:absolute;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.3) 10%,rgba(255,255,255,.5) 50%,rgba(255,255,255,.3) 90%,transparent 100%);transition:bottom .6s cubic-bezier(.4,0,.2,1);animation:separationShimmer 2s ease-in-out infinite;z-index:6;box-shadow:0 1px 2px #fff3,0 -1px 2px #0003}@keyframes separationShimmer{0%,to{opacity:.7;box-shadow:0 1px 2px #fff3,0 -1px 2px #0003}50%{opacity:1;box-shadow:0 1px 3px #fff6,0 -1px 3px #0000004d}}.bubbles{position:absolute;bottom:0;left:0;right:0;height:100%;pointer-events:none;z-index:7}.bubble{position:absolute;bottom:0;width:5px;height:5px;background:radial-gradient(circle at 30% 30%,#fffc,#fff6,#fff3);border-radius:50%;border:1px solid rgba(255,255,255,.3);animation:rise 1.2s ease-in infinite;box-shadow:inset -1px -1px 2px #0003,0 2px 4px #0000001a}@keyframes rise{0%{transform:translateY(0) scale(1);opacity:0}10%{opacity:.8}90%{opacity:.6}to{transform:translateY(-140px) scale(.3);opacity:0}}.result-card{padding:24px;border-radius:var(--radius-sm);background:#ffffff08;border:1px solid var(--border-glass);animation:fadeSlideUp .5s ease;transition:box-shadow .4s,border-color .4s}.result-card.glow-safe{border-color:var(--success);box-shadow:0 0 30px var(--success-glow),inset 0 0 30px #22c55e14}.result-card.glow-moderate{border-color:var(--warning);box-shadow:0 0 30px var(--warning-glow),inset 0 0 30px #eab30814}.result-card.glow-danger{border-color:var(--danger);box-shadow:0 0 30px var(--danger-glow),inset 0 0 30px #ef444414;animation:flashDanger .4s ease-in-out 3}@keyframes flashDanger{0%,to{opacity:1}50%{opacity:.6}}@keyframes fadeSlideUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.result-header{display:flex;align-items:center;gap:12px;margin-bottom:16px}.result-icon{font-size:1.4rem}.result-header h3{flex:1;font-size:1rem;font-weight:600}.risk-badge{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;padding:4px 12px;border-radius:999px}.risk-badge.safe{background:#22c55e26;color:var(--success)}.risk-badge.moderate{background:#eab30826;color:var(--warning)}.risk-badge.danger{background:#ef444426;color:var(--danger)}.result-equation{font-size:1.05rem;font-weight:600;color:var(--accent);padding:12px 16px;background:#6366f114;border-radius:var(--radius-xs);margin-bottom:16px;letter-spacing:.03em;text-align:center}.result-details{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}@media(max-width:600px){.result-details{grid-template-columns:1fr}}.detail-item{padding:10px 14px;background:#ffffff08;border-radius:var(--radius-xs);border:1px solid var(--border-glass)}.detail-label{display:block;font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);margin-bottom:4px}.detail-value{font-size:.88rem;color:var(--text-primary)}.teacher-panel{margin-top:16px;padding:16px;background:#6366f10f;border:1px solid rgba(99,102,241,.2);border-radius:var(--radius-xs);animation:fadeSlideUp .4s ease}.teacher-panel h4{font-size:.85rem;margin-bottom:12px;color:var(--accent)}.teacher-equation{display:flex;flex-direction:column;gap:4px;margin-bottom:10px;padding:10px 14px;background:#6366f114;border-radius:var(--radius-xs)}.teacher-eq-label{font-size:.68rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted)}.teacher-eq-value{font-size:.9rem;color:var(--text-primary);font-weight:500}.teacher-risk-breakdown{display:flex;align-items:center;gap:10px;margin-bottom:10px;padding:8px 14px;background:#ffffff08;border-radius:var(--radius-xs)}.risk-pill{font-size:.7rem;font-weight:700;text-transform:uppercase;padding:3px 10px;border-radius:999px}.risk-pill.safe{background:#22c55e26;color:var(--success)}.risk-pill.moderate{background:#eab30826;color:var(--warning)}.risk-pill.danger{background:#ef444426;color:var(--danger)}.teacher-notes-text{font-size:.84rem;line-height:1.6;color:var(--text-secondary);margin-top:8px}.chat-panel{display:flex;flex-direction:column;height:calc(100vh - 120px);position:sticky;top:80px;padding:0;overflow:hidden}.chat-header{display:flex;align-items:center;gap:12px;padding:18px 20px;border-bottom:1px solid var(--border-glass)}.chat-avatar{font-size:1.6rem}.chat-header h3{font-size:.95rem;font-weight:600}.status-dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:5px}.status-dot.online{background:var(--success);box-shadow:0 0 6px var(--success-glow)}.status-text{font-size:.72rem;color:var(--text-muted)}.chat-messages{flex:1;overflow-y:auto;padding:20px;display:flex;flex-direction:column;gap:14px}.chat-messages::-webkit-scrollbar{width:4px}.chat-messages::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:999px}.chat-bubble{max-width:90%;padding:12px 16px;border-radius:14px;font-size:.86rem;line-height:1.55;animation:fadeSlideUp .35s ease}.chat-bubble.bot{align-self:flex-start;background:#ffffff0f;border:1px solid var(--border-glass);color:var(--text-primary)}.chat-bubble.user{align-self:flex-end;background:linear-gradient(135deg,var(--accent),#818cf8);color:#fff;border:none}.chat-bubble p{margin:0}.chat-input-bar{display:flex;gap:8px;padding:16px;border-top:1px solid var(--border-glass)}.chat-input-bar input{flex:1;padding:12px 16px;background:#ffffff0a;border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-sm);color:var(--text-primary);font-family:var(--font);font-size:.88rem;outline:none;transition:var(--transition)}.chat-input-bar input::placeholder{color:var(--text-muted)}.chat-input-bar input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}.send-btn{padding:12px 16px;background:var(--accent);border:none;border-radius:var(--radius-sm);color:#fff;font-size:1rem;cursor:pointer;transition:var(--transition)}.send-btn:hover{background:#818cf8}.smoke-3d-container{position:fixed;inset:0;z-index:50;pointer-events:none;animation:fadeSlideUp .6s ease}.explosion-overlay{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;pointer-events:none;animation:explosionFadeIn .2s ease;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.explosion-circle{width:80px;height:80px;border-radius:50%;background:radial-gradient(circle,rgba(239,68,68,.9) 0%,rgba(239,68,68,.3) 50%,transparent 70%);animation:explosionExpand 1.5s ease-out forwards}@keyframes explosionExpand{0%{transform:scale(.3);opacity:1}40%{opacity:.8}to{transform:scale(20);opacity:0}}.explosion-flash{position:absolute;inset:0;background:#ef444440;animation:explosionFlash .6s ease-out}@keyframes explosionFlash{0%{opacity:1}to{opacity:0}}@keyframes explosionFadeIn{0%{opacity:0}to{opacity:1}}.shake{animation:screenShake .5s ease-in-out}@keyframes screenShake{0%,to{transform:translate(0)}10%{transform:translate(-6px,4px)}20%{transform:translate(6px,-4px)}30%{transform:translate(-4px,6px)}40%{transform:translate(4px,-6px)}50%{transform:translate(-6px,2px)}60%{transform:translate(6px,-2px)}70%{transform:translate(-2px,6px)}80%{transform:translate(2px,-6px)}90%{transform:translate(-4px,4px)}}.nav-tabs{display:flex;gap:4px;background:#ffffff0a;padding:4px;border-radius:var(--radius-sm)}.nav-tab{padding:8px 20px;background:transparent;border:none;border-radius:var(--radius-xs);color:var(--text-muted);font-family:var(--font);font-size:.82rem;font-weight:500;cursor:pointer;transition:var(--transition);white-space:nowrap}.nav-tab:hover{color:var(--text-primary);background:#ffffff0a}.nav-tab.active{color:#fff;background:var(--accent);box-shadow:0 2px 12px var(--accent-glow)}.page-content{position:relative;z-index:1;animation:fadeSlideUp .35s ease;flex:1}.guide-page{max-width:1100px;margin:28px auto;padding:0 28px}.guide-hero{text-align:center;margin-bottom:32px;padding:32px 20px;background:var(--bg-card);border:1px solid var(--border-glass);border-radius:var(--radius);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px)}.guide-title{font-size:1.6rem;font-weight:700;margin-bottom:8px}.guide-subtitle{font-size:.9rem;color:var(--text-secondary);margin-bottom:20px}.guide-stats{display:flex;justify-content:center;gap:20px;flex-wrap:wrap}.guide-stat{padding:10px 20px;border-radius:var(--radius-xs);background:#ffffff0a;border:1px solid var(--border-glass);text-align:center;min-width:80px}.guide-stat.safe{border-color:#22c55e4d}.guide-stat.moderate{border-color:#eab3084d}.guide-stat.danger{border-color:#ef44444d}.stat-num{display:block;font-size:1.4rem;font-weight:700;color:var(--text-primary)}.guide-stat.safe .stat-num{color:var(--success)}.guide-stat.moderate .stat-num{color:var(--warning)}.guide-stat.danger .stat-num{color:var(--danger)}.stat-label{font-size:.68rem;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted)}.guide-toolbar{display:flex;gap:12px;margin-bottom:24px;flex-wrap:wrap}.guide-search{flex:1;min-width:240px;position:relative}.guide-search .search-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);font-size:1rem;pointer-events:none}.guide-search input{width:100%;padding:12px 16px 12px 42px;background:#ffffff0a;border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-sm);color:var(--text-primary);font-family:var(--font);font-size:.88rem;outline:none;transition:var(--transition)}.guide-search input::placeholder{color:var(--text-muted)}.guide-search input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}.guide-filter select{padding:12px 16px;min-width:160px;background:#ffffff0a;border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-sm);color:var(--text-primary);font-family:var(--font);font-size:.88rem;appearance:none;cursor:pointer;outline:none;transition:var(--transition)}.guide-filter select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}.guide-filter select option{background:#1e293b;color:#f1f5f9}.guide-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:16px}.reaction-card{padding:20px;cursor:pointer;transition:var(--transition),transform .2s;border:1px solid var(--border-glass)}.reaction-card:hover{transform:translateY(-3px);box-shadow:0 12px 40px #0006;border-color:#ffffff1f}.reaction-card.expanded{border-color:var(--accent);box-shadow:0 0 20px var(--accent-glow)}.rc-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px}.rc-chemicals{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.rc-chem{font-size:.88rem;font-weight:600;color:var(--text-primary);padding:4px 10px;background:#ffffff0f;border-radius:var(--radius-xs);border:1px solid var(--border-glass)}.rc-plus{color:var(--text-muted);font-weight:300;font-size:1.1rem}.rc-meta{display:flex;align-items:center;gap:8px;flex-shrink:0}.rc-type{font-size:.72rem;font-weight:500;color:var(--text-secondary);padding:3px 8px;background:#ffffff0a;border-radius:999px}.rc-short{font-size:.84rem;color:var(--text-secondary);line-height:1.5;margin-bottom:6px}.rc-expand-hint{font-size:.7rem;color:var(--text-muted)}.rc-collapse-hint{font-size:.7rem;color:var(--text-muted);text-align:center;display:block;margin-top:12px}.rc-details{margin-top:14px;animation:fadeSlideUp .3s ease}.rc-detail-block{margin-bottom:12px;padding:12px 14px;background:#ffffff08;border-radius:var(--radius-xs);border:1px solid var(--border-glass)}.rc-detail-block.teacher{background:#6366f10f;border-color:#6366f133}.rc-detail-label{display:block;font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);margin-bottom:6px}.rc-equation{font-size:.95rem;font-weight:600;color:var(--accent);padding:8px 12px;background:#6366f114;border-radius:var(--radius-xs)}.rc-detail-text{font-size:.84rem;color:var(--text-secondary);line-height:1.6}.risk-badge-guide{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;padding:4px 10px;border-radius:999px;display:inline-flex;align-items:center;gap:5px}.risk-badge-guide.safe{background:#22c55e26;color:var(--success)}.risk-badge-guide.moderate{background:#eab30826;color:var(--warning)}.risk-badge-guide.danger{background:#ef444426;color:var(--danger)}.pulse-dot{width:6px;height:6px;border-radius:50%;background:var(--danger);animation:pulseDot 1.2s ease-in-out infinite}@keyframes pulseDot{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.8);opacity:.4}}.guide-loading,.guide-empty{text-align:center;padding:60px 20px;color:var(--text-muted)}.spinner{width:32px;height:32px;margin:0 auto 16px;border:3px solid rgba(255,255,255,.1);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.footer{position:relative;z-index:1;text-align:center;padding:12px 20px;font-size:.75rem;color:var(--text-muted);border-top:1px solid var(--border-glass);margin-top:auto}.searchable-select{position:relative;width:100%;z-index:1}.searchable-label{display:block;font-size:.75rem;font-weight:600;margin-bottom:8px;color:#546e7a;text-transform:uppercase;letter-spacing:2px;font-family:JetBrains Mono,monospace}.searchable-trigger{width:100%;padding:12px 16px;background:#ffffff08;border:1.5px solid rgba(255,255,255,.08);border-radius:10px;color:#e0f7fa;font-family:Syne,sans-serif;font-size:.88rem;cursor:pointer;display:flex;justify-content:space-between;align-items:center;transition:all .2s;-webkit-user-select:none;user-select:none}.searchable-trigger:hover{border-color:#00bcd459;background:#00bcd40f}.searchable-trigger:focus-within{border-color:#00bcd480;box-shadow:0 0 0 3px #00bcd426}.searchable-value{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#cfd8dc}.searchable-arrow{font-size:.7rem;color:#546e7a;transition:transform .2s ease;margin-left:8px}.searchable-arrow.open{transform:rotate(180deg);color:#00bcd4}.searchable-dropdown{position:absolute;top:calc(100% + 6px);left:0;right:0;background:#0a1929;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(0,188,212,.25);border-radius:12px;box-shadow:0 20px 60px #000c,0 0 0 1px #00bcd426;z-index:1000;animation:dropdownSlide .2s ease;overflow:hidden}@keyframes dropdownSlide{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.searchable-search{padding:10px 12px;border-bottom:1px solid rgba(0,188,212,.1);background:#00bcd408}.searchable-input{width:100%;padding:8px 12px;background:#ffffff0a;border:1px solid rgba(0,188,212,.2);border-radius:7px;color:#cfd8dc;font-family:Syne,sans-serif;font-size:.85rem;outline:none;transition:all .2s}.searchable-input:focus{border-color:#00bcd480;box-shadow:0 0 0 2px #00bcd426;background:#00bcd40f}.searchable-input::placeholder{color:#546e7a}.searchable-options{max-height:280px;overflow-y:auto;padding:4px;background:#071520}.searchable-options::-webkit-scrollbar{width:6px}.searchable-options::-webkit-scrollbar-track{background:#0003;border-radius:3px}.searchable-options::-webkit-scrollbar-thumb{background:#00bcd44d;border-radius:3px}.searchable-options::-webkit-scrollbar-thumb:hover{background:#00bcd480}.searchable-option{padding:10px 12px;cursor:pointer;border-radius:8px;transition:all .15s;display:flex;justify-content:space-between;align-items:center;gap:12px;border:1px solid transparent}.searchable-option:hover{background:#00bcd414;border-color:#00bcd426}.searchable-option.selected{background:#00bcd41f;border-color:#00bcd44d}.option-name{flex:1;font-size:.85rem;color:#e0f7fa;font-weight:500}.option-formula{font-size:.78rem;color:#00bcd4;font-weight:700;padding:3px 10px;background:#00bcd41f;border-radius:6px;border:1px solid rgba(0,188,212,.25);font-family:JetBrains Mono,monospace;letter-spacing:.5px}.searchable-empty{padding:20px;text-align:center;color:#546e7a;font-size:.85rem}.lab-instructions{margin:16px 0;min-height:60px;display:flex;align-items:center;justify-content:center}.instruction-card{display:flex;align-items:center;gap:12px;padding:12px 20px;background:#ffffff0a;border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-xs);animation:fadeSlideUp .4s ease;transition:var(--transition)}.instruction-card.active{background:#6366f11a;border-color:#6366f14d;box-shadow:0 0 20px #6366f126}.instruction-card.result-safe{background:#22c55e1a;border-color:#22c55e4d;box-shadow:0 0 20px #22c55e26}.instruction-card.result-moderate{background:#eab3081a;border-color:#eab3084d;box-shadow:0 0 20px #eab30826}.instruction-card.result-danger{background:#ef44441a;border-color:#ef44444d;box-shadow:0 0 20px #ef444426;animation:pulseGlow 2s ease-in-out infinite}@keyframes pulseGlow{0%,to{box-shadow:0 0 20px #ef444426}50%{box-shadow:0 0 30px #ef44444d}}.instruction-icon{font-size:1.5rem;flex-shrink:0;animation:iconBounce 2s ease-in-out infinite}@keyframes iconBounce{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}.instruction-text{font-size:.88rem;color:var(--text-secondary);margin:0;line-height:1.4;font-weight:500}.instruction-card.active .instruction-text{color:var(--accent)}.instruction-card.result-safe .instruction-text{color:var(--success)}.instruction-card.result-moderate .instruction-text{color:var(--warning)}.instruction-card.result-danger .instruction-text{color:var(--danger)}.litmus-container{padding:16px;background:#ffffff08;border:1px solid var(--border-glass);border-radius:var(--radius-xs);animation:fadeSlideUp .5s ease}.litmus-label{display:flex;align-items:center;gap:8px;margin-bottom:12px}.litmus-icon{font-size:1.2rem}.litmus-title{font-size:.9rem;font-weight:600;color:var(--text-primary)}.litmus-paper-holder{position:relative;display:flex;justify-content:center;margin-bottom:16px;min-height:120px}.litmus-paper{width:60px;height:120px;border-radius:8px;position:relative;box-shadow:0 4px 12px #0000004d,inset 0 2px 4px #fff3,inset 0 -2px 4px #0003;transition:background .8s ease;animation:litmusDip 1s ease-out;overflow:hidden}@keyframes litmusDip{0%{transform:translateY(-20px);opacity:0}50%{transform:translateY(10px)}to{transform:translateY(0);opacity:1}}.litmus-texture{position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent,transparent 2px,rgba(255,255,255,.05) 2px,rgba(255,255,255,.05) 4px);pointer-events:none}.litmus-result{position:absolute;bottom:12px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:4px;animation:fadeIn .6s ease .4s both}@keyframes fadeIn{0%{opacity:0;transform:translate(-50%) translateY(10px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.ph-value{font-size:1.1rem;font-weight:700;color:#000c;text-shadow:0 1px 2px rgba(255,255,255,.5);background:#ffffff4d;padding:2px 8px;border-radius:4px}.ph-label{font-size:.65rem;font-weight:600;color:#000000b3;text-transform:uppercase;letter-spacing:.05em;text-shadow:0 1px 1px rgba(255,255,255,.3)}.litmus-instruction{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;font-size:.75rem;color:var(--text-muted);width:100px}.ph-scale{margin-top:12px}.ph-scale-bar{position:relative;height:8px;border-radius:4px;background:linear-gradient(to right,#ef4444,#fb923c 20%,#fbbf24,#a855f7,#60a5fa,#3b82f6 80%,#2563eb);margin-bottom:6px;box-shadow:0 2px 4px #0003}.ph-marker{position:absolute;top:50%;transform:translate(-50%,-50%);width:12px;height:12px;background:#fff;border:2px solid rgba(0,0,0,.3);border-radius:50%;box-shadow:0 2px 6px #0000004d;transition:left .6s ease;animation:markerPulse 2s ease-in-out infinite}@keyframes markerPulse{0%,to{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-50%) scale(1.2)}}.ph-scale-labels{display:flex;justify-content:space-between;font-size:.7rem;font-weight:600;color:var(--text-muted);margin-bottom:4px}.ph-scale-center{position:absolute;left:50%;transform:translate(-50%)}.ph-scale-text{display:flex;justify-content:space-between;font-size:.65rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.03em}.ph-scale-text span:first-child{color:#ef4444}.ph-scale-text span:last-child{color:#3b82f6}.tutor-call-container{position:fixed;bottom:20px;right:20px;width:380px;height:300px;background:#000000d9;border:1px solid cyan;border-radius:12px;z-index:1000;display:flex;flex-direction:column;overflow:hidden}.tutor-call-header{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;background:#00c8ff1a;color:#0ff;font-size:14px}.end-call-btn{background:#f44;color:#fff;border:none;border-radius:6px;padding:4px 10px;cursor:pointer}.start-tutor-btn{background:linear-gradient(135deg,#00bcd4,#0097a7);color:#fff;border:none;border-radius:8px;padding:10px 20px;cursor:pointer;font-size:14px;margin-top:10px}.litmus-container{margin-top:24px;padding:20px 24px;border-radius:16px;background:#0003;border:1px solid rgba(255,255,255,.04);animation:slide-up .5s cubic-bezier(.16,1,.3,1)}.litmus-label{display:flex;align-items:center;gap:10px;margin-bottom:16px}.litmus-icon{font-size:18px}.litmus-title{font-size:14px;font-weight:700;color:#e0f7fa;letter-spacing:.5px;font-family:Syne,sans-serif}.litmus-paper-holder{display:flex;flex-direction:column;align-items:center;margin-bottom:20px}.litmus-paper{width:120px;height:180px;border-radius:8px;border:2px solid rgba(255,255,255,.1);position:relative;overflow:hidden;transition:all .6s ease;box-shadow:0 8px 24px #0000004d}.litmus-texture{position:absolute;inset:0;background-image:repeating-linear-gradient(45deg,transparent,transparent 2px,rgba(255,255,255,.02) 2px,rgba(255,255,255,.02) 4px);pointer-events:none}.litmus-result{position:absolute;bottom:16px;left:50%;transform:translate(-50%);text-align:center;background:#000000b3;padding:8px 12px;border-radius:8px;border:1px solid rgba(255,255,255,.1)}.ph-value{display:block;font-size:16px;font-weight:700;color:#e0f7fa;font-family:JetBrains Mono,monospace}.ph-label{display:block;font-size:10px;color:#78909c;margin-top:2px;letter-spacing:1px;font-family:JetBrains Mono,monospace}.litmus-instruction{margin-top:12px;text-align:center}.litmus-instruction span{font-size:12px;color:#546e7a;font-style:italic}.ph-scale{position:relative}.ph-scale-bar{height:8px;background:linear-gradient(to right,#ef4444,#fb923c,#a855f7,#60a5fa,#3b82f6);border-radius:4px;position:relative;margin-bottom:8px}.ph-marker{position:absolute;top:-2px;width:12px;height:12px;background:#e0f7fa;border:2px solid #00bcd4;border-radius:50%;transform:translate(-50%);transition:left .6s ease;box-shadow:0 0 8px #00bcd480}.ph-scale-labels{display:flex;justify-content:space-between;font-size:10px;color:#78909c;font-family:JetBrains Mono,monospace;margin-bottom:4px}.ph-scale-center{color:#a855f7!important;font-weight:700}.ph-scale-text{display:flex;justify-content:space-between;font-size:9px;color:#546e7a;letter-spacing:1px;font-family:JetBrains Mono,monospace}.litmus-paper{animation:litmus-dip .8s ease-in-out}@keyframes litmus-dip{0%{transform:translateY(0)}30%{transform:translateY(-8px)}60%{transform:translateY(4px)}to{transform:translateY(0)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}