.q-d{--q-d-line:var(--sl-color-gray-4);--q-d-label:var(--sl-color-gray-3);--q-d-gap:.75rem;font-family:var(--sl-font);font-size:var(--sl-text-body-sm);color:var(--sl-color-text);margin:2rem 0;line-height:1.45}.q-d__body{justify-content:safe center;padding-top:.5rem;display:flex;overflow-x:auto}.q-d__body>*{flex-shrink:0}.q-d__body:is([data-stacked],[data-stack=none])>*{flex-shrink:1}.q-d__caption{text-align:center;max-width:60ch;font-size:var(--sl-text-2xs);color:var(--sl-color-gray-3);margin:.75rem auto 0}.q-d [data-tone]{--t-dot:var(--sl-color-gray-4);--t-low:var(--sl-color-gray-7);--t-high:var(--sl-color-white)}.q-d [data-tone=purple]{--t-dot:var(--sl-color-purple);--t-low:var(--sl-color-purple-low);--t-high:var(--sl-color-purple-high)}.q-d [data-tone=blue]{--t-dot:var(--sl-color-blue);--t-low:var(--sl-color-blue-low);--t-high:var(--sl-color-blue-high)}.q-d [data-tone=green]{--t-dot:var(--sl-color-green);--t-low:var(--sl-color-green-low);--t-high:var(--sl-color-green-high)}.q-d [data-tone=amber]{--t-dot:var(--sl-color-orange);--t-low:var(--sl-color-orange-low);--t-high:var(--sl-color-orange-high)}.q-d [data-tone=red]{--t-dot:var(--sl-color-red);--t-low:var(--sl-color-red-low);--t-high:var(--sl-color-red-high)}.q-d-flow{align-items:center;display:flex}.q-d-flow[data-align=stretch]{align-items:stretch}.q-d-flow>.q-d-node+.q-d-node{margin-inline-start:.375rem}.q-d-node{border:1px solid color-mix(in srgb, var(--t-dot) 45%, var(--q-border));border-radius:var(--q-radius);background:color-mix(in srgb, var(--t-low) 45%, transparent);min-width:0;color:var(--sl-color-white);flex-direction:column;justify-content:center;gap:.125rem;padding:.5rem .75rem;display:flex}.q-d-node__title{white-space:nowrap;align-items:center;gap:.5rem;font-weight:600;display:flex}.q-d-node__title:before{content:"";border-radius:var(--q-radius);background:var(--t-dot);flex-shrink:0;width:.5rem;height:.5rem}.q-d-node__sub{white-space:pre-line;font-size:var(--sl-text-2xs);color:var(--sl-color-gray-3);padding-left:1rem}.q-d-node[data-variant=solid]{border-color:var(--t-dot);background:var(--t-low);color:var(--t-high)}.q-d-node[data-variant=solid] .q-d-node__sub{color:color-mix(in srgb, var(--t-high) 75%, transparent)}.q-d-node[data-variant=ghost]{border-style:dashed;border-color:var(--sl-color-gray-5);color:var(--sl-color-gray-3);background:0 0}.q-d-node[data-variant=ghost] .q-d-node__title{font-weight:400}.q-d-node code{border-radius:var(--q-radius);background:color-mix(in srgb, currentColor 12%, transparent);font-size:inherit;padding:0 .25rem}.q-d-arrow{--a-color:var(--q-d-line);--a-label:var(--q-d-label);min-width:2.5rem;font-size:var(--sl-text-2xs);text-align:center;flex:0 auto;grid-template-rows:1fr auto 1fr;line-height:1.35;display:grid}.q-d-arrow[data-tone]{--a-color:var(--t-dot);--a-label:var(--t-high)}.q-d-arrow__label,.q-d-arrow__sub{white-space:nowrap;padding-inline:.625rem}.q-d-arrow__label{color:var(--a-label);align-self:end;padding-bottom:.25rem}.q-d-arrow__sub{color:var(--sl-color-gray-4);align-self:start;padding-top:.25rem}.q-d-arrow__line{border-top:1px solid var(--a-color);position:relative}.q-d-arrow[data-dashed] .q-d-arrow__line{border-top-style:dashed}.q-d-arrow__line:after{content:"";border-block:4px solid #0000;border-left:7px solid var(--a-color);position:absolute;top:-4.5px;right:-1px}.q-d-arrow[data-reverse] .q-d-arrow__line:after{border-left:0;border-right:7px solid var(--a-color);left:-1px;right:auto}.q-d-arrow[data-head=none] .q-d-arrow__line:after{content:none}.q-d-group{--g-title-lh:1rem;justify-content:center;gap:var(--q-d-gap);border:1px solid var(--sl-color-gray-5);border-radius:var(--q-radius);background:0 0;flex-direction:column;padding:0 .75rem .75rem;display:flex}.q-d-group[data-dashed]{border-style:dashed}.q-d-group[data-tone]{border-color:color-mix(in srgb, var(--t-dot) 55%, var(--q-border))}.q-d-group__title{margin:calc(var(--g-title-lh) / -2) 0 0 -.375rem;background:var(--sl-color-bg);font-size:var(--sl-text-2xs);letter-spacing:.06em;font-weight:600;line-height:var(--g-title-lh);text-transform:uppercase;white-space:nowrap;color:var(--sl-color-gray-3);align-self:flex-start;padding-inline:.375rem}.q-d-group[data-tone] .q-d-group__title{color:var(--t-high)}.q-d-group>:not(.q-d-group__title){align-self:center}.q-d-rows{grid-template-columns:var(--r-cols);row-gap:var(--q-d-gap);display:grid}.q-d-rows[data-gap=none]{row-gap:0}.q-d-rows>.q-d-flow{grid-column:1/-1;grid-template-columns:subgrid;align-items:stretch;display:grid}.q-d-rows>:not(.q-d-flow){grid-column:1/-1}.q-d-rows[data-spine]{position:relative}.q-d-rows[data-spine=start]{padding-left:1rem}.q-d-rows[data-spine=end]{padding-right:1rem}.q-d-rows[data-spine]:before{content:"";border-top:1px solid var(--q-d-line);width:1rem;position:absolute;top:50%}.q-d-rows[data-spine=start]:before{left:0}.q-d-rows[data-spine=end]:before{right:0}.q-d-rows[data-spine=end]:after{content:"";border-block:4px solid #0000;border-left:7px solid var(--q-d-line);position:absolute;top:calc(50% - 3.5px);right:-1px}.q-d-rows[data-spine]>.q-d-flow{position:relative}.q-d-rows[data-spine]>.q-d-flow:before{content:"";top:calc(var(--q-d-gap) / -2);bottom:calc(var(--q-d-gap) / -2);border-left:1px solid var(--q-d-line);position:absolute}.q-d-rows[data-spine=start]>.q-d-flow:before{left:0}.q-d-rows[data-spine=end]>.q-d-flow:before{right:0}.q-d-rows[data-spine]>.q-d-flow:first-child:before{top:50%}.q-d-rows[data-spine]>.q-d-flow:last-child:before{bottom:50%}.q-d-loop{--l-h:2.125rem;padding-top:var(--l-h);flex-direction:column;align-items:stretch;display:flex}.q-d-loop__back{height:var(--l-h);color:var(--t-high);font-size:var(--sl-text-2xs);flex-direction:column;align-items:center;line-height:1.35;display:flex}.q-d-loop__bracket{border:1px dashed var(--t-dot);border-top:0;align-self:stretch;height:.75rem;margin-inline:30%;position:relative}.q-d-loop__bracket:after{content:"";border-inline:4px solid #0000;border-bottom:7px solid var(--t-dot);position:absolute;top:0;left:-4.5px}.q-d-loop__back>span{padding-top:.125rem}.q-d-flow[data-direction=column],.q-d__body[data-stacked] .q-d-flow:not(.q-d-rows>*){flex-direction:column;align-items:center;&>:is(.q-d-node,.q-d-group,.q-d-loop),&>.q-d-arrow{align-self:stretch}&>.q-d-loop{padding-top:0}}.q-d-arrow:is([data-direction=down],.q-d-flow[data-direction=column]>*,.q-d__body[data-stacked] .q-d-flow:not(.q-d-rows>*)>*){grid-template-rows:none;grid-template-columns:1fr auto 1fr;min-width:0;min-height:2rem;& .q-d-arrow__label{text-align:left;grid-area:1/3;align-self:center;padding:0 0 0 .625rem}& .q-d-arrow__sub{text-align:right;grid-area:1/1;align-self:center;padding:0 .625rem 0 0}& .q-d-arrow__line{border-top:0;border-left:1px solid var(--a-color);grid-area:1/2}&[data-dashed] .q-d-arrow__line{border-left-style:dashed}& .q-d-arrow__line:after{border:0;border-inline:4px solid #0000;border-top:7px solid var(--a-color);inset:auto auto -1px -4.5px}&[data-reverse] .q-d-arrow__line:after{border-top:0;border-bottom:7px solid var(--a-color);top:-1px;bottom:auto}&:has(+.q-d-group,+.q-d-loop){margin-bottom:.5rem}}.q-d__body[data-stacked] .q-d-group>:not(.q-d-group__title){align-self:stretch}.q-d-rows[data-spine=start]:is(.q-d-flow[data-direction=column]>*,.q-d__body[data-stacked] .q-d-flow:not(.q-d-rows>*)>*){align-self:stretch;margin-top:.75rem;padding-left:1.5rem;&:before{content:none}&>.q-d-flow:first-child:before{top:-.75rem}}