.prop-drilling-demo:where(.astro-lltxioqt){margin:2rem 0;font-family:system-ui,-apple-system,sans-serif;position:relative}.controls:where(.astro-lltxioqt){margin-bottom:2rem;display:flex;gap:1rem;align-items:center}.component-tree:where(.astro-lltxioqt){position:relative;min-height:300px;background:#212737;border-radius:.5rem;padding:2rem}.component-row:where(.astro-lltxioqt){margin:2rem 0;position:relative}.component:where(.astro-lltxioqt){position:relative;border:2px solid rgb(171,75,153);border-radius:.5rem;padding:1.5rem;width:200px;margin:0 auto;background:#343f60;cursor:pointer;transition:all .3s ease,background-color .5s ease;z-index:2;color:#eaedf3}.component:where(.astro-lltxioqt):hover{transform:translateY(-2px);box-shadow:0 4px 15px #ff6bed33}.component:where(.astro-lltxioqt).highlight{border-color:#ff6bed;background:#8a337b;box-shadow:0 0 15px #ff6bed4d;transform:translateY(-2px) scale(1.05)}.prop-arrow:where(.astro-lltxioqt){position:absolute;bottom:-35px;left:50%;width:2px;height:30px;background:linear-gradient(to bottom,#ff6bed33,#ff6bed99);transform:translate(-50%);overflow:hidden}.prop-arrow:where(.astro-lltxioqt):after{content:"";position:absolute;bottom:-6px;left:-4px;border:5px solid transparent;border-top-color:#ff6bed}.prop-dot:where(.astro-lltxioqt){position:absolute;width:6px;height:6px;background:#ff6bed;border-radius:50%;left:50%;transform:translate(-50%) translateY(-100%);opacity:0}.prop-arrow:where(.astro-lltxioqt).animate .prop-dot:where(.astro-lltxioqt){animation:moveDot .6s cubic-bezier(.4,0,.2,1) forwards}.user-button:where(.astro-lltxioqt){padding:.75rem 1.5rem;background:linear-gradient(135deg,#ff6bed,#ab4b99);color:#eaedf3;border:none;border-radius:.5rem;cursor:pointer;font-weight:500;transition:transform .2s ease}.user-button:where(.astro-lltxioqt):hover{transform:scale(1.05)}.user-indicator:where(.astro-lltxioqt){font-size:1rem;color:#eaedf3;padding:.5rem 1rem;border-radius:.5rem;background:#343f60;transition:background .3s ease}.component-tooltip:where(.astro-lltxioqt){position:absolute;top:-30px;left:50%;transform:translate(-50%);background:#000c;color:#fff;padding:4px 8px;border-radius:4px;font-size:.8rem;white-space:nowrap;opacity:0;transition:opacity .2s ease;pointer-events:none}.component:where(.astro-lltxioqt):hover .component-tooltip:where(.astro-lltxioqt){opacity:1}.user-text:where(.astro-lltxioqt){transition:all .3s ease}.pinia-demo:where(.astro-kemvofvq){margin:2rem 0;font-family:system-ui,-apple-system,sans-serif;position:relative}.controls:where(.astro-kemvofvq){margin-bottom:2rem;display:flex;gap:1rem;align-items:center}.component-tree:where(.astro-kemvofvq){position:relative;min-height:400px;background:#212737;border-radius:.5rem;padding:2rem;display:grid;grid-template-columns:250px 1fr;gap:2rem}@media(max-width:768px){.component-tree:where(.astro-kemvofvq){grid-template-columns:1fr;padding:1.5rem;gap:1.5rem}.store:where(.astro-kemvofvq){max-width:250px;margin:0 auto}.components-container:where(.astro-kemvofvq){margin-top:1rem}}.store-container:where(.astro-kemvofvq){display:flex;flex-direction:column;justify-content:center}.store:where(.astro-kemvofvq){position:relative;border:3px solid rgb(255,107,237);border-radius:.5rem;padding:1.5rem;background:#8a337b;color:#eaedf3;height:-moz-fit-content;height:fit-content}.store-header:where(.astro-kemvofvq){font-weight:700;margin-bottom:1rem;font-size:1.1em}.components-container:where(.astro-kemvofvq){display:flex;flex-direction:column;gap:2rem}.component-row:where(.astro-kemvofvq){position:relative}.component:where(.astro-kemvofvq){position:relative;border:2px solid rgb(171,75,153);border-radius:.5rem;padding:1.5rem;width:250px;margin:0 auto;background:#343f60;cursor:pointer;transition:all .3s ease;z-index:2;color:#eaedf3}.component:where(.astro-kemvofvq):hover{transform:translate(10px);box-shadow:0 4px 15px #ff6bed33}.component:where(.astro-kemvofvq).highlight{border-color:#ff6bed;background:#8a337b;box-shadow:0 0 15px #ff6bed4d}.store-access:where(.astro-kemvofvq){font-family:monospace;font-size:.9em;color:#ff6bed;margin-bottom:.5rem;opacity:0;transform:translate(-10px);transition:all .3s ease}.component:where(.astro-kemvofvq).highlight .store-access:where(.astro-kemvofvq){opacity:1;transform:translate(0)}.user-button:where(.astro-kemvofvq){padding:.75rem 1.5rem;background:linear-gradient(135deg,#ff6bed,#ab4b99);color:#eaedf3;border:none;border-radius:.5rem;cursor:pointer;font-weight:500;transition:transform .2s ease}.user-button:where(.astro-kemvofvq):hover{transform:scale(1.05)}.user-indicator:where(.astro-kemvofvq){font-size:1rem;color:#eaedf3;padding:.5rem 1rem;border-radius:.5rem;background:#343f60}@keyframes storeUpdate{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}.store:where(.astro-kemvofvq).updating{animation:storeUpdate .5s ease-in-out}.composable-demo:where(.astro-iyhjxl7g){margin:2rem 0;font-family:system-ui,-apple-system,sans-serif;position:relative}.controls:where(.astro-iyhjxl7g){margin-bottom:2rem;display:flex;gap:1rem;align-items:center}.component-tree:where(.astro-iyhjxl7g){position:relative;min-height:400px;background:#212737;border-radius:.5rem;padding:2rem;display:grid;grid-template-columns:250px 1fr;gap:2rem}@media(max-width:768px){.component-tree:where(.astro-iyhjxl7g){grid-template-columns:1fr;padding:.75rem;min-height:300px;gap:1rem}.composable-container:where(.astro-iyhjxl7g){margin-bottom:1rem}.component:where(.astro-iyhjxl7g){width:100%;max-width:100%;padding:1rem}.components-container:where(.astro-iyhjxl7g){gap:1rem}.code-snippet:where(.astro-iyhjxl7g){font-size:.8em;padding:.25rem}.composable:where(.astro-iyhjxl7g){padding:1rem}.composable-header:where(.astro-iyhjxl7g){margin-bottom:.5rem;font-size:1em}}.composable-container:where(.astro-iyhjxl7g){display:flex;flex-direction:column;justify-content:center}.composable:where(.astro-iyhjxl7g){position:relative;border:3px solid rgb(255,107,237);border-radius:.5rem;padding:1.5rem;background:#8a337b;color:#eaedf3;height:-moz-fit-content;height:fit-content}.composable-header:where(.astro-iyhjxl7g){font-weight:700;margin-bottom:1rem;font-size:1.1em}.code-snippet:where(.astro-iyhjxl7g){font-family:monospace;font-size:.9em;padding:.5rem;background:#0000004d;border-radius:.25rem;line-height:1.4}.components-container:where(.astro-iyhjxl7g){display:flex;flex-direction:column;gap:2rem}.component-row:where(.astro-iyhjxl7g){position:relative}.component:where(.astro-iyhjxl7g){position:relative;border:2px solid rgb(171,75,153);border-radius:.5rem;padding:1.5rem;width:250px;margin:0 auto;background:#343f60;cursor:pointer;transition:all .3s ease;z-index:2;color:#eaedf3}.component:where(.astro-iyhjxl7g):hover{transform:translate(10px);box-shadow:0 4px 15px #ff6bed33}.component:where(.astro-iyhjxl7g).highlight{border-color:#ff6bed;background:#8a337b;box-shadow:0 0 15px #ff6bed4d}.composable-access:where(.astro-iyhjxl7g){font-family:monospace;font-size:.9em;color:#ff6bed;margin-bottom:.5rem;opacity:0;transform:translate(-10px);transition:all .3s ease}.component:where(.astro-iyhjxl7g).highlight .composable-access:where(.astro-iyhjxl7g){opacity:1;transform:translate(0)}.user-button:where(.astro-iyhjxl7g){padding:.75rem 1.5rem;background:linear-gradient(135deg,#ff6bed,#ab4b99);color:#eaedf3;border:none;border-radius:.5rem;cursor:pointer;font-weight:500;transition:transform .2s ease}.user-button:where(.astro-iyhjxl7g):hover{transform:scale(1.05)}.user-indicator:where(.astro-iyhjxl7g){font-size:1rem;color:#eaedf3;padding:.5rem 1rem;border-radius:.5rem;background:#343f60}@keyframes composableUpdate{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}.composable:where(.astro-iyhjxl7g).updating{animation:composableUpdate .5s ease-in-out}.provide-inject-demo:where(.astro-fqo3k26n){margin:2rem 0;font-family:system-ui,-apple-system,sans-serif;position:relative}.controls:where(.astro-fqo3k26n){margin-bottom:2rem;display:flex;gap:1rem;align-items:center}.component-tree:where(.astro-fqo3k26n){position:relative;min-height:400px;background:#212737;border-radius:.5rem;padding:2rem;display:grid;grid-template-columns:250px 1fr;gap:2rem}.provider-container:where(.astro-fqo3k26n){display:flex;flex-direction:column;gap:1rem}.provider:where(.astro-fqo3k26n),.symbol-key:where(.astro-fqo3k26n){position:relative;border:3px solid rgb(255,107,237);border-radius:.5rem;padding:1.5rem;background:#8a337b;color:#eaedf3}.provider-header:where(.astro-fqo3k26n),.symbol-header:where(.astro-fqo3k26n){font-weight:700;margin-bottom:1rem;font-size:1.1em}.code-snippet:where(.astro-fqo3k26n){font-family:monospace;font-size:.9em;padding:.5rem;background:#0000004d;border-radius:.25rem;line-height:1.4}.components-container:where(.astro-fqo3k26n){display:flex;flex-direction:column;gap:2rem}.component-row:where(.astro-fqo3k26n){position:relative}.component:where(.astro-fqo3k26n){position:relative;border:2px solid rgb(171,75,153);border-radius:.5rem;padding:1.5rem;width:250px;margin:0 auto;background:#343f60;cursor:pointer;transition:all .3s ease;z-index:2;color:#eaedf3}.component:where(.astro-fqo3k26n):hover{transform:translate(10px);box-shadow:0 4px 15px #ff6bed33}.component:where(.astro-fqo3k26n).highlight{border-color:#ff6bed;background:#8a337b;box-shadow:0 0 15px #ff6bed4d}.provide-code:where(.astro-fqo3k26n),.inject-code:where(.astro-fqo3k26n){font-family:monospace;font-size:.9em;color:#ff6bed;margin-bottom:.5rem;opacity:0;transform:translate(-10px);transition:all .3s ease}.pass-through:where(.astro-fqo3k26n){font-style:italic;color:#ab4b99;font-size:.9em;text-align:center}.component:where(.astro-fqo3k26n).highlight .provide-code:where(.astro-fqo3k26n),.component:where(.astro-fqo3k26n).highlight .inject-code:where(.astro-fqo3k26n){opacity:1;transform:translate(0)}.provide-arrow:where(.astro-fqo3k26n){position:absolute;bottom:-35px;left:50%;width:2px;height:30px;background:linear-gradient(to bottom,#ff6bed33,#ff6bed99);transform:translate(-50%);overflow:hidden}.provide-arrow:where(.astro-fqo3k26n):after{content:"";position:absolute;bottom:-6px;left:-4px;border:5px solid transparent;border-top-color:#ff6bed}.provide-dot:where(.astro-fqo3k26n){position:absolute;width:6px;height:6px;background:#ff6bed;border-radius:50%;left:50%;transform:translate(-50%) translateY(-100%);opacity:0}.provide-arrow:where(.astro-fqo3k26n).animate .provide-dot:where(.astro-fqo3k26n){animation:moveDot .8s cubic-bezier(.4,0,.2,1) forwards}@keyframes moveDot{0%{transform:translate(-50%) translateY(-100%);opacity:1}to{transform:translate(-50%) translateY(100%);opacity:0}}.user-button:where(.astro-fqo3k26n){padding:.75rem 1.5rem;background:linear-gradient(135deg,#ff6bed,#ab4b99);color:#eaedf3;border:none;border-radius:.5rem;cursor:pointer;font-weight:500;transition:transform .2s ease}.user-button:where(.astro-fqo3k26n):hover{transform:scale(1.05)}.user-indicator:where(.astro-fqo3k26n){font-size:1rem;color:#eaedf3;padding:.5rem 1rem;border-radius:.5rem;background:#343f60}@keyframes providerUpdate{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}.provider:where(.astro-fqo3k26n).updating{animation:providerUpdate .5s ease-in-out}@media(max-width:768px){.component-tree:where(.astro-fqo3k26n){grid-template-columns:1fr;padding:1rem;gap:1.5rem}.provider-container:where(.astro-fqo3k26n){max-width:100%}.provider:where(.astro-fqo3k26n),.symbol-key:where(.astro-fqo3k26n){padding:1rem}.component:where(.astro-fqo3k26n){width:100%;max-width:300px;padding:1rem}.code-snippet:where(.astro-fqo3k26n){font-size:.8em;padding:.5rem;overflow-x:auto}.controls:where(.astro-fqo3k26n){flex-direction:column;align-items:stretch}.user-button:where(.astro-fqo3k26n){width:100%}.user-indicator:where(.astro-fqo3k26n){text-align:center}}.event-bus-demo:where(.astro-gcb4dmcu){margin:2rem 0;font-family:system-ui,-apple-system,sans-serif;position:relative}.controls:where(.astro-gcb4dmcu){margin-bottom:2rem;display:flex;gap:1rem;align-items:center}.demo-container:where(.astro-gcb4dmcu){position:relative;min-height:auto;background:#212737;border-radius:.5rem;padding:1rem;display:flex;flex-direction:column;gap:1.5rem;overflow-x:hidden}.event-bus:where(.astro-gcb4dmcu){position:relative;border:2px solid rgb(255,107,237);border-radius:.5rem;padding:1rem;background:#8a337b;color:#eaedf3;margin:0 auto;width:95%;max-width:600px}.event-bus-header:where(.astro-gcb4dmcu){font-weight:700;margin-bottom:1rem;font-size:1.1em;text-align:center}.code-snippet:where(.astro-gcb4dmcu){font-family:monospace;font-size:.8em;padding:.25rem;background:#0000004d;border-radius:.25rem;line-height:1.3}.components-grid:where(.astro-gcb4dmcu){display:grid;grid-template-columns:repeat(2,1fr);gap:2rem;padding:0 1rem}.component:where(.astro-gcb4dmcu){position:relative;border:2px solid rgb(171,75,153);border-radius:.5rem;padding:1.5rem;background:#343f60;cursor:pointer;transition:all .3s ease;z-index:2;color:#eaedf3}.component:where(.astro-gcb4dmcu):hover{transform:translateY(-5px);box-shadow:0 4px 15px #ff6bed33}.component:where(.astro-gcb4dmcu).highlight{border-color:#ff6bed;background:#8a337b;box-shadow:0 0 15px #ff6bed4d}.emit-code:where(.astro-gcb4dmcu),.listen-code:where(.astro-gcb4dmcu){font-family:monospace;font-size:.9em;color:#ff6bed;margin-bottom:.5rem;opacity:0;transform:translateY(5px);transition:all .3s ease}.component:where(.astro-gcb4dmcu).highlight .emit-code:where(.astro-gcb4dmcu),.component:where(.astro-gcb4dmcu).highlight .listen-code:where(.astro-gcb4dmcu){opacity:1;transform:translateY(0)}.event-dot:where(.astro-gcb4dmcu){position:absolute;width:8px;height:8px;border-radius:50%;top:-4px;left:50%;transform:translate(-50%)}.event-dot:where(.astro-gcb4dmcu).emitter{background:#ff6bed;box-shadow:0 0 8px #ff6bed}.event-dot:where(.astro-gcb4dmcu).listener{background:#4caf50;box-shadow:0 0 8px #4caf50}.event-paths:where(.astro-gcb4dmcu){position:absolute;inset:0;pointer-events:none}.event-particle:where(.astro-gcb4dmcu){position:absolute;width:6px;height:6px;border-radius:50%;background:#ff6bed;pointer-events:none;opacity:0}.user-button:where(.astro-gcb4dmcu){padding:.75rem 1.5rem;background:linear-gradient(135deg,#ff6bed,#ab4b99);color:#eaedf3;border:none;border-radius:.5rem;cursor:pointer;font-weight:500;transition:transform .2s ease}.user-button:where(.astro-gcb4dmcu):hover{transform:scale(1.05)}.user-indicator:where(.astro-gcb4dmcu){font-size:1rem;color:#eaedf3;padding:.5rem 1rem;border-radius:.5rem;background:#343f60}@keyframes eventBusUpdate{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}.event-bus:where(.astro-gcb4dmcu).updating{animation:eventBusUpdate .5s ease-in-out}@keyframes particleMove{0%{transform:translate(0);opacity:1}to{opacity:0}}@media(max-width:768px){.event-bus-demo:where(.astro-gcb4dmcu){margin:1rem 0}.controls:where(.astro-gcb4dmcu){margin-bottom:1rem}.demo-container:where(.astro-gcb4dmcu){padding:.75rem;gap:1rem}.event-bus:where(.astro-gcb4dmcu){padding:.75rem}.event-bus-header:where(.astro-gcb4dmcu){font-size:1em;margin-bottom:.5rem}.components-grid:where(.astro-gcb4dmcu){grid-template-columns:repeat(2,1fr);gap:.75rem;padding:0}.component:where(.astro-gcb4dmcu){padding:.75rem;font-size:.9em}.component-header:where(.astro-gcb4dmcu){font-size:.9em;margin-bottom:.25rem}.emit-code:where(.astro-gcb4dmcu),.listen-code:where(.astro-gcb4dmcu){font-size:.75em;margin-bottom:.25rem}.user-button:where(.astro-gcb4dmcu){padding:.5rem 1rem;font-size:.9em}.user-indicator:where(.astro-gcb4dmcu){font-size:.9em;padding:.4rem .8rem}.component:where(.astro-gcb4dmcu):hover{transform:none}}