.qd-demo-stage{--bg:#fff;--bg-soft:#f5f6f6;--text:#626363;--line:rgba(98,99,99,.22);--line-soft:rgba(98,99,99,.16);--dot:rgba(98,99,99,.2);--accent-green:#219c66;--code-bg:#fff;--code-stroke:rgba(15,23,42,.1);--code-text:rgba(15,23,42,.92);position:relative;width:100%;max-width:900px;aspect-ratio:16/9;min-height:450px;background:var(--bg-soft);border:1px solid var(--line-soft);border-radius:18px;overflow:hidden;font-family:"Assistant",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}.qd-demo-stage,.qd-demo-stage *{box-sizing:border-box}.qd-demo-stage .qd-grid-bg{position:absolute;inset:0;background-image:radial-gradient(var(--dot) 1px,transparent 1px);background-size:14px 14px;z-index:0}.qd-demo-stage .qd-svg-layer{position:absolute;inset:0;pointer-events:none}.qd-demo-stage .qd-box-hidden{opacity:0!important;pointer-events:none!important}.qd-demo-stage .qd-box.qd-box-hidden{transform:scale(.8)}.qd-demo-stage .qd-coder-light.qd-box-hidden{transform:translateY(20px) scale(.95)}.qd-demo-stage #feature-box{left:-175px;top:24%}.qd-demo-stage #core-box{right:15%;top:12%}.qd-demo-stage #code-window-1{right:10%;top:40%;z-index:20}.qd-demo-stage #code-window-2{right:13%;top:48%;z-index:30}.qd-demo-stage #code-window-3{right:16%;top:56%;z-index:40}.qd-demo-stage .qd-box{position:absolute;background:var(--bg);border:1px solid var(--line-soft);border-radius:14px;z-index:20;display:flex;align-items:center;justify-content:center;padding:10px 12px;transform-origin:center;transition:transform .4s cubic-bezier(.2,.8,.2,1),opacity .4s ease,left 1.5s cubic-bezier(.2,.8,.2,1),top 1.5s cubic-bezier(.2,.8,.2,1),width 1.2s cubic-bezier(.34,1.56,.64,1),padding 1.2s cubic-bezier(.34,1.56,.64,1),background-color .15s ease,border-color .15s ease}.qd-demo-stage .qd-box-active-click{background-color:#eef8f3!important;border-color:var(--accent-green)!important;transform:scale(.92)!important;transition:background-color .15s ease,border-color .15s ease,transform .15s ease!important}.qd-demo-stage .qd-snap-bounce{animation:snap-bounce .4s cubic-bezier(.34,1.56,.64,1) forwards!important}@keyframes snap-bounce{0%{transform:scale(1)}50%{transform:scale(1.06)}100%{transform:scale(1)}}.qd-demo-stage .qd-box.qd-feature-icon-state{padding:14px;width:56px;height:56px}.qd-demo-stage .qd-box.qd-feature-icon-state .qd-box-inner{gap:0}.qd-demo-stage .qd-box-inner{display:flex;align-items:center;gap:8px;white-space:nowrap;overflow:hidden;transition:gap 1.2s cubic-bezier(.34,1.56,.64,1)}.qd-demo-stage .qd-main-icon svg,.qd-demo-stage .qd-core-icon svg{display:block;color:var(--text);flex-shrink:0}.qd-demo-stage .qd-feature-text,.qd-demo-stage .qd-core-text{font-size:13px;font-weight:600;color:var(--text);line-height:1.2}.qd-demo-stage .qd-node{position:absolute;width:8px;height:8px;background:var(--bg-soft);border:1px solid var(--line);border-radius:50%;z-index:21;opacity:0;transform:scale(0);transition:all .4s cubic-bezier(.34,1.56,.64,1)}.qd-demo-stage .qd-node.visible{opacity:1;transform:scale(1)}.qd-demo-stage .qd-node.active{border-color:var(--accent-green);background:var(--accent-green)}.qd-demo-stage .qd-node-top{top:-5px;left:50%;margin-left:-5px}.qd-demo-stage .qd-node-bottom{bottom:-5px;left:50%;margin-left:-5px}.qd-demo-stage .qd-node-right{right:-5px;top:50%;margin-top:-5px}.qd-demo-stage .qd-node-left{left:-5px;top:50%;margin-top:-5px}.qd-demo-stage .qd-coder-light{position:absolute;width:min(85%,340px);height:180px;background:var(--code-bg);border:1px solid var(--code-stroke);border-radius:14px;display:flex;flex-direction:column;transition:transform .5s cubic-bezier(.2,.8,.2,1),opacity .5s ease,width .6s ease,height .6s ease,top .6s ease,right .6s ease,background .6s ease;box-shadow:0 4px 20px rgba(0,0,0,.03)}.qd-demo-stage .qd-coder__content{border-radius:0 0 14px 14px}.qd-demo-stage .qd-coder-light.qd-consolidated{width:120px!important;height:120px!important;min-height:120px;right:15%!important;top:46%!important;padding:12px;background:var(--bg);border-color:var(--line-soft);box-shadow:0 10px 30px rgba(0,0,0,.05)}.qd-demo-stage .qd-consolidated-header{font-size:11px;font-weight:600;color:var(--text);margin-bottom:8px;text-align:center;opacity:0;animation:fade-in-grid .4s .2s ease forwards}.qd-demo-stage .qd-mini-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;width:100%;height:calc(100% - 20px);opacity:0;animation:fade-in-grid .4s .4s ease forwards}@keyframes fade-in-grid{to{opacity:1}}.qd-demo-stage .qd-mini-cell{background:#e2f2eb;border-radius:4px;border:1px dashed var(--accent-green);display:flex;align-items:center;justify-content:center;color:#9ca3af}.qd-demo-stage .qd-mini-cell:nth-child(3){grid-column:span 2}.qd-demo-stage .qd-window-done{opacity:.8;filter:grayscale(1);transition:all .6s ease}.qd-demo-stage .qd-pulse-ring{position:absolute;border:2px solid var(--accent-green);border-radius:15px;z-index:150;pointer-events:none;animation:pulse-ring .6s cubic-bezier(.2,.8,.2,1) forwards}@keyframes pulse-ring{0%{transform:scale(1);opacity:.8}100%{transform:scale(1.05);opacity:0}}.qd-demo-stage .qd-coder__winTop{display:flex;align-items:center;padding:10px 12px;border-bottom:1px solid var(--code-stroke);background:rgba(15,23,42,.02);border-radius:14px 14px 0 0;transition:opacity .3s ease}.qd-demo-stage .qd-coder__dot{width:9px;height:9px;border-radius:999px;display:inline-block;margin-right:6px}.qd-demo-stage .qd-coder__dot--r{background:#ff5f57}.qd-demo-stage .qd-coder__dot--y{background:#febc2e}.qd-demo-stage .qd-coder__dot--g{background:#28c840}.qd-demo-stage .qd-coder__title{font-family:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace!important;font-size:11px!important;line-height:1.1!important;font-weight:600!important;color:rgba(15,23,42,.6);margin-left:auto}.qd-demo-stage .qd-coder__content{padding:14px;flex-grow:1;overflow-y:auto;overflow-x:hidden}.qd-demo-stage .qd-coder__content pre,.qd-demo-stage .qd-coder__content code,.qd-demo-stage .qd-coder__content pre code,.qd-demo-stage .qd-coder__content span{font-family:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace!important;letter-spacing:0!important}.qd-demo-stage .qd-coder__content pre{margin:0!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;color:var(--code-text)!important;font-size:11px!important;line-height:1.55!important;font-weight:400!important;white-space:pre-wrap!important;overflow:visible!important}.qd-demo-stage .qd-coder__content code,.qd-demo-stage .qd-coder__content pre code{display:inline!important;margin:0!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;color:inherit!important;font-size:inherit!important;line-height:inherit!important}.qd-demo-stage .qd-tok-kw{color:#2563eb}.qd-demo-stage .qd-tok-fn{color:#059669}.qd-demo-stage .qd-tok-str{color:#d97706}.qd-demo-stage .qd-tok-dim{color:#64748b;font-style:italic}.qd-demo-stage .qd-typing-cursor{height:1em;display:none;margin-left:4px;vertical-align:middle;width:2px;background:var(--accent-green);animation:blink 1s steps(1,end) infinite}.qd-demo-stage .qd-typing-cursor-code{height:1.15em;vertical-align:-.2em;margin-left:2px;width:2px;background:rgba(15,23,42,.85);display:none;animation:blink 1s steps(1,end) infinite}@keyframes blink{0%,49%{opacity:1}50%,100%{opacity:0}}.qd-demo-stage #data-package-container{position:absolute;z-index:15;pointer-events:none;opacity:0;color:var(--accent-green);transform:translate(-50%,-50%)}.qd-demo-stage .qd-pulsing-box{animation:icon-pulse .8s infinite alternate cubic-bezier(.2,.8,.2,1)}@keyframes icon-pulse{0%{transform:scale(.85)}100%{transform:scale(1.1)}}.qd-demo-stage #binary-particles{position:absolute;z-index:15;pointer-events:none;opacity:0;transition:opacity .2s ease}.qd-demo-stage .bin-particle{position:absolute;color:var(--accent-green);font-family:"JetBrains Mono",monospace;font-size:10px;font-weight:700;opacity:0;animation:bin-float 1.2s infinite ease-out}.qd-demo-stage .bin-particle:nth-child(1){left:-14px;top:-14px;animation-delay:0s}.qd-demo-stage .bin-particle:nth-child(2){left:10px;top:-18px;animation-delay:.4s}.qd-demo-stage .bin-particle:nth-child(3){left:-8px;top:10px;animation-delay:.8s}@keyframes bin-float{0%{transform:translateY(0) scale(.6);opacity:1}100%{transform:translateY(-20px) scale(1.1);opacity:0}}.qd-demo-stage .qd-confetti{position:absolute;width:6px;height:6px;border-radius:2px;background:var(--accent-green);z-index:4000;pointer-events:none}.qd-demo-stage .qd-cursor{position:absolute;left:0;top:0;z-index:9999;pointer-events:none;opacity:0;transition:opacity .4s ease}.qd-demo-stage .qd-cursor svg{transition:transform .15s cubic-bezier(.2,.8,.2,1);transform-origin:2px 2px;filter:drop-shadow(0 4px 6px rgba(0,0,0,.1))}.qd-demo-stage .qd-cursor.grabbing svg{transform:scale(.75)}.qd-demo-stage .qd-noodle{fill:none;stroke:var(--line);stroke-width:1.5;stroke-linecap:round;stroke-dasharray:3 4}.qd-demo-stage .qd-noodle.active{stroke:var(--accent-green);animation:ant-flow 1.5s linear infinite}@keyframes ant-flow{to{stroke-dashoffset:-28}}.qd-demo-stage .qd-dialog{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.8);background:var(--bg);border:1px solid var(--line);border-radius:14px;padding:24px 32px;opacity:0;z-index:3000;transition:all .4s ease;pointer-events:none}.qd-demo-stage .qd-dialog-content{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.qd-demo-stage .qd-dialog.show{opacity:1;transform:translate(-50%,-50%) scale(1);pointer-events:auto}.qd-demo-stage .qd-dialog p{margin:0 0 16px;font-size:14px;font-weight:600;color:var(--text);line-height:1.3}.qd-demo-stage .qd-dialog button{background:#e5484d;color:#fff;border:none;padding:8px 20px;border-radius:8px;font-weight:600;cursor:pointer;transition:background .2s ease}.qd-demo-stage .qd-dialog button:hover{background:#d43b40}.qd-demo-stage .qd-box.success{border-color:var(--accent-green)}.qd-demo-stage .qd-box.success svg{color:var(--accent-green)}@media (max-width:768px){.qd-demo-stage{min-height:600px}.qd-demo-stage #feature-box{top:20%;left:-150px}.qd-demo-stage #core-box{right:5%;top:8%}.qd-demo-stage #code-window-1{right:15%;top:45%}.qd-demo-stage #code-window-2{right:10%;top:57%}.qd-demo-stage #code-window-3{right:5%;top:69%}.qd-demo-stage .qd-coder-light.qd-consolidated{top:65%!important;right:15%!important}}