.diagram-modal{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;padding:2rem;opacity:0;transition:opacity .3s ease}.diagram-modal-backdrop{position:absolute;inset:0;background:#000000e6}.diagram-modal-content{position:relative;z-index:10000;max-width:95vw;max-height:90vh;overflow:auto;background:#0d0d0f;border:2px solid #04d9ff;border-radius:.5rem;padding:2rem}.diagram-modal-close{position:sticky;top:0;right:0;float:right;background:#1a1a1e;border:1px solid #04d9ff;color:#04d9ff;font-size:1.5rem;width:2.5rem;height:2.5rem;border-radius:.25rem;cursor:pointer;transition:all .2s;z-index:10001}.diagram-modal-close:hover{background:#04d9ff;color:#0d0d0f}.diagram-modal-diagram{display:flex;align-items:center;justify-content:center;min-height:300px;padding:1rem;overflow:auto;width:100%}.diagram-modal-diagram pre.mermaid,.diagram-modal-diagram svg{transform:scale(1.2);transform-origin:center center}@media(min-width:640px){.diagram-modal-diagram pre.mermaid,.diagram-modal-diagram svg{transform:scale(1.5);transform-origin:center center}}@media(min-width:1024px){.diagram-modal-diagram pre.mermaid,.diagram-modal-diagram svg{transform:scale(1.8);transform-origin:center center}}@media(min-width:1920px){.diagram-modal-diagram pre.mermaid,.diagram-modal-diagram svg{transform:scale(2.2);transform-origin:center center}}pre.mermaid{display:flex;justify-content:center;align-items:center;min-height:200px;background:transparent;border:none;padding:0;margin:0}pre.mermaid svg{max-width:100%;height:auto;filter:drop-shadow(0 0 10px rgba(4,217,255,.3))}.mermaid .node rect,.mermaid .node circle,.mermaid .node polygon{stroke-width:2px!important;filter:drop-shadow(0 0 5px rgba(4,217,255,.4))}.mermaid .flowchart-link{stroke-width:2px!important;filter:drop-shadow(0 0 3px rgba(4,217,255,.5))}.mermaid .node.decision rect,.mermaid .node.decision polygon{stroke:#8b5cf6!important;filter:drop-shadow(0 0 5px rgba(139,92,246,.4))}.diagram-modal{position:fixed;top:0;left:0;width:100%;height:100%;z-index:9999;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s ease}.diagram-modal.active{opacity:1}.diagram-modal-backdrop{position:absolute;top:0;left:0;width:100%;height:100%;background:#050506f2;backdrop-filter:blur(10px);cursor:pointer}.diagram-modal-content{position:relative;width:75vw;height:85vh;background:#0d0d0f;border:2px solid #04d9ff;border-radius:1rem;padding:2rem;box-shadow:0 0 30px #04d9ff66,0 0 60px #04d9ff33;transform:scale(.9);transition:transform .3s ease;overflow:visible;display:flex;align-items:center;justify-content:center}.diagram-modal.active .diagram-modal-content{transform:scale(1)}.diagram-modal-close{position:absolute;top:-1rem;right:-1rem;width:3rem;height:3rem;background:#8b5cf6;border:2px solid #8b5cf6;border-radius:50%;color:#fff;font-size:1.5rem;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;box-shadow:0 0 20px #8b5cf699,0 0 40px #8b5cf64d;font-family:JetBrains Mono,monospace}.diagram-modal-close:hover{background:#04d9ff;border-color:#04d9ff;box-shadow:0 0 20px #04d9ff99,0 0 40px #04d9ff4d;transform:rotate(90deg)}.diagram-modal-diagram{display:flex;justify-content:center;align-items:center;width:100%;height:100%;overflow:visible}.diagram-modal-diagram pre{background:transparent;border:none;padding:0;margin:0;display:flex;justify-content:center;align-items:center;transform:scale(2.6)!important;transform-origin:center center;pointer-events:none}.diagram-modal-diagram svg{filter:drop-shadow(0 0 20px rgba(4,217,255,.5))}pre.mermaid:hover:not(.diagram-modal-diagram pre){transform:scale(1.02);transition:transform .2s ease}.diagram-modal-diagram pre.mermaid:hover{transform:scale(2.6)!important}pre.mermaid:after{content:"🔍 Click to expand";position:absolute;bottom:1rem;right:1rem;background:#04d9ff33;border:1px solid rgba(4,217,255,.4);color:#04d9ff;padding:.5rem 1rem;border-radius:.5rem;font-size:.75rem;font-family:JetBrains Mono,monospace;opacity:0;transition:opacity .2s ease;pointer-events:none}pre.mermaid:hover:after{opacity:1}pre.mermaid{position:relative}.copy-code-button{position:absolute;top:.75rem;right:1.25rem;display:flex;align-items:center;gap:.5rem;padding:.5rem .75rem;background:#04d9ff1a;border:1px solid rgba(4,217,255,.3);border-radius:.375rem;color:#04d9ff;font-family:JetBrains Mono,monospace;font-size:.75rem;font-weight:600;cursor:pointer;transition:all .2s ease;opacity:.7;z-index:10}.copy-code-button:hover{opacity:1;background:#04d9ff33;border-color:#04d9ff99;box-shadow:0 0 10px #04d9ff4d;transform:translateY(-1px)}.copy-code-button.copied{background:#00ff7f33;border-color:#00ff7f99;color:#00ff7f}.copy-code-button svg{width:14px;height:14px;flex-shrink:0}.copy-button-text{white-space:nowrap}@media(max-width:768px){.diagram-modal-content{width:95vw!important;height:80vh!important;padding:1rem!important}.diagram-modal-diagram pre,.diagram-modal-diagram pre.mermaid:hover{transform:scale(1.2)!important}.diagram-modal-close{width:2.5rem!important;height:2.5rem!important;font-size:1.25rem!important;top:-.75rem!important;right:-.75rem!important}}@media(min-width:769px)and (max-width:1024px){.diagram-modal-content{width:85vw!important;height:82vh!important;padding:1.5rem!important}.diagram-modal-diagram pre,.diagram-modal-diagram pre.mermaid:hover{transform:scale(1.8)!important}.diagram-modal-close{width:2.75rem!important;height:2.75rem!important;font-size:1.35rem!important}}.tutorial-sidebar[data-astro-cid-brwb6m5a]{scrollbar-width:thin;scrollbar-color:#04d9ff #1a1a1e}.tutorial-sidebar[data-astro-cid-brwb6m5a]::-webkit-scrollbar{width:6px}.tutorial-sidebar[data-astro-cid-brwb6m5a]::-webkit-scrollbar-track{background:#1a1a1e}.tutorial-sidebar[data-astro-cid-brwb6m5a]::-webkit-scrollbar-thumb{background:#04d9ff;border-radius:3px}.tutorial-sidebar[data-astro-cid-brwb6m5a]::-webkit-scrollbar-thumb:hover{background:#06b6d4}
