@layer reset,tokens,base,components;@layer features{.diagram{--dg-yellow:#ffdc49;--dg-orange:#fe9f4d;--dg-red:#ff6464;--dg-green:#2cc75c;--dg-blue:#659df2;--dg-violet:#8f7fee;--dg-board:var(--lightningcss-light,#f2f2f2)var(--lightningcss-dark,#1e1e20);--dg-dot:var(--lightningcss-light,#ccc)var(--lightningcss-dark,color-mix(in srgb, var(--palette-white) 14%, transparent));--dg-surface:var(--lightningcss-light,#fff)var(--lightningcss-dark,#2a2a2c);--dg-border:var(--lightningcss-light,#b0b0b0)var(--lightningcss-dark,#595959);--dg-line:var(--lightningcss-light,#595959)var(--lightningcss-dark,#b0b0b0);--dg-text:var(--lightningcss-light,#1a1a1a)var(--lightningcss-dark,#f2f2f2);--dg-yellow-fill:var(--lightningcss-light,#fff6b6)var(--lightningcss-dark,color-mix(in srgb, var(--dg-yellow) 24%, var(--dg-board)));--dg-orange-fill:var(--lightningcss-light,#f8d3ae)var(--lightningcss-dark,color-mix(in srgb, var(--dg-orange) 24%, var(--dg-board)));--dg-red-fill:var(--lightningcss-light,#ffc6c6)var(--lightningcss-dark,color-mix(in srgb, var(--dg-red) 24%, var(--dg-board)));--dg-green-fill:var(--lightningcss-light,#adf0c7)var(--lightningcss-dark,color-mix(in srgb, var(--dg-green) 24%, var(--dg-board)));--dg-blue-fill:var(--lightningcss-light,#c6dcff)var(--lightningcss-dark,color-mix(in srgb, var(--dg-blue) 24%, var(--dg-board)));--dg-violet-fill:var(--lightningcss-light,#dedaff)var(--lightningcss-dark,color-mix(in srgb, var(--dg-violet) 24%, var(--dg-board)));width:100%;margin-block:var(--space-24);position:relative}.diagram-board{border-radius:var(--radius-12);outline:1px solid var(--color-surface-tint);background-color:var(--dg-board);background-image:radial-gradient(circle, var(--dg-dot) 1px, transparent 1.25px);background-position:50%;background-size:20px 20px;overflow:hidden}.diagram-padding{padding:var(--space-4)}.diagram-image{margin-inline:auto}@media (width>=40rem){.diagram-board{border-radius:var(--radius-16)}.diagram-padding{padding:var(--space-8)}}.diagram svg{text-rendering:geometricprecision;width:100%;height:auto;display:block}.diagram g.node>rect,.diagram g.node>path,.diagram g.node>ellipse,.diagram g.node>line{stroke-width:1.5px}.diagram path.edge{stroke-width:1.25px}.diagram g.edge-label>rect{fill:var(--dg-board);stroke:none}.diagram g.edge-label[data-tone]>rect{fill:var(--diagram-label-wash)}.diagram g.edge-label>text{fill:var(--dg-text);font-weight:500}.diagram g.subgraph>rect:nth-of-type(2){fill:none;stroke:none}.diagram g.subgraph[data-tone]>rect:first-of-type{fill:var(--diagram-group-wash);stroke:var(--dg-tone);stroke-width:1.5px;stroke-dasharray:6 4}.diagram g.subgraph[data-tone]>text{fill:var(--dg-text)}.diagram g[data-tone]{--diagram-label-wash:color-mix(in srgb, var(--dg-tone-fill) 30%, var(--dg-board));--diagram-group-wash:color-mix(in srgb, var(--dg-tone-fill) 30%, transparent)}.diagram g[data-tone=yellow]{--dg-tone:var(--dg-yellow);--dg-tone-fill:var(--dg-yellow-fill)}.diagram g[data-tone=orange]{--dg-tone:var(--dg-orange);--dg-tone-fill:var(--dg-orange-fill)}.diagram g[data-tone=red]{--dg-tone:var(--dg-red);--dg-tone-fill:var(--dg-red-fill)}.diagram g[data-tone=green]{--dg-tone:var(--dg-green);--dg-tone-fill:var(--dg-green-fill)}.diagram g[data-tone=blue]{--dg-tone:var(--dg-blue);--dg-tone-fill:var(--dg-blue-fill)}.diagram g[data-tone=violet]{--dg-tone:var(--dg-violet);--dg-tone-fill:var(--dg-violet-fill)}}@layer utilities;
