.law-diagram { margin: 1.5rem 0; max-width: 100%; padding-block: 1rem; border-block: 1px solid rgb(var(--color-paper-rule)); }
.law-diagram figcaption { font: 0.8rem/1.5 Roboto, sans-serif; color: rgb(var(--color-paper-ink)); }
.law-diagram__viewport { max-height: 32rem; max-width: 100%; overflow: auto; overscroll-behavior: contain; margin-top: 0.75rem; }
.law-diagram svg { display: block; height: auto; max-width: none; }
.law-diagram__expand, .law-diagram__toolbar button { min-height: 44px; padding: 0.5rem 0.75rem; text-decoration: underline; font: 0.875rem/1.5 Roboto, sans-serif; cursor: pointer; }
.law-diagram__expand { padding-left: 0; }
.law-diagram__expand:hover, .law-diagram__toolbar button:hover { color: #9333ea; }
.law-diagram__viewport:focus-visible, .law-diagram-dialog__canvas:focus-visible, .law-diagram button:focus-visible, .law-diagram__toolbar button:focus-visible { outline: 2px solid #9333ea; outline-offset: 2px; }
.law-diagram-dialog { width: 95vw; height: 90vh; max-width: 100rem; max-height: 95vh; padding: 1rem; background: rgb(var(--color-paper-bg)); color: rgb(var(--color-paper-ink)); border: 1px solid rgb(var(--color-paper-rule)); }
.law-diagram-dialog[open] { display: flex; flex-direction: column; }
.law-diagram-dialog::backdrop { background: rgb(0 0 0 / 0.65); }
.law-diagram__toolbar { display: flex; flex-wrap: wrap; gap: 0.25rem; border-bottom: 1px solid rgb(var(--color-paper-rule)); padding-bottom: 0.5rem; }
.law-diagram__toolbar button:last-child { margin-left: auto; }
.law-diagram-dialog__canvas { overflow: auto; flex: 1; min-height: 0; margin-top: 0.75rem; }
.law-diagram-dialog__canvas svg { max-width: none; height: auto; }