.diagram{--identity: var(--brand-accent);--lvl-cluster-tint: color-mix(in srgb, var(--brand-paleblue) 60%, var(--neutral-0));--lvl-cluster-edge: color-mix(in srgb, var(--brand-skyblue) 40%, var(--neutral-0));--lvl-industry-tint: color-mix(in srgb, var(--brand-skyblue) 24%, var(--neutral-0));--lvl-industry-edge: color-mix(in srgb, var(--brand-primary) 28%, var(--neutral-0));--lvl-container-bg: var(--neutral-0);--lvl-container-edge: color-mix(in srgb, var(--brand-primary) 35%, var(--border-default));background:var(--bg-default);color:var(--text-default);padding:var(--section-pad-y) var(--page-gutter);border-radius:var(--radius-2xl);overflow:hidden;margin:var(--space-5) auto;max-width:var(--container-wide)}.diagram__inner{max-width:var(--container-max);margin:0 auto}.diagram__head{max-width:640px;margin:0 0 var(--space-7)}.diagram__eyebrow{display:inline-block;font-size:var(--text-caption);text-transform:uppercase;letter-spacing:var(--ls-widest);font-weight:var(--fw-semibold);color:var(--brand-primary);margin:0 0 var(--space-3)}.diagram__title{font-size:var(--text-h2);line-height:var(--lh-tight);letter-spacing:var(--ls-tight);font-weight:var(--fw-bold);color:var(--text-default);margin:0 0 var(--space-3);text-wrap:balance;max-width:22ch}.diagram__subline{font-size:var(--text-lead);line-height:var(--lh-snug);color:var(--text-muted);margin:0;max-width:60ch;text-wrap:pretty}.diagram__shell{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:var(--space-7);align-items:start}@media(max-width:980px){.diagram__shell{grid-template-columns:1fr;gap:var(--space-6)}}.diagram__canvas{position:relative;aspect-ratio:16 / 11;border-radius:var(--radius-xl);background:radial-gradient(120% 80% at 0% 0%,color-mix(in srgb,var(--brand-paleblue) 22%,transparent),transparent 55%),radial-gradient(100% 90% at 100% 100%,color-mix(in srgb,var(--brand-accent) 8%,transparent),transparent 60%),var(--bg-subtle);border:1px solid var(--border-default);overflow:hidden;isolation:isolate}.diagram__canvas:before{content:"";position:absolute;inset:0;background-image:radial-gradient(currentColor 1px,transparent 1px);background-size:28px 28px;background-position:-1px -1px;color:color-mix(in srgb,var(--brand-primary) 12%,transparent);opacity:.55;-webkit-mask-image:linear-gradient(135deg,#000 0%,#000 60%,transparent 100%);mask-image:linear-gradient(135deg,#000 0%,#000 60%,transparent 100%);pointer-events:none}.diagram .lvl{position:absolute;border-radius:var(--radius-lg);transition:border-color var(--transition-base),box-shadow var(--transition-base),background-color var(--transition-base),transform var(--transition-base)}.diagram .lvl__tag{position:absolute;top:14px;left:14px;display:inline-flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;padding:5px 9px 5px 5px;background:var(--neutral-0);border:1px solid var(--border-default);border-radius:var(--radius-full);color:var(--text-default);z-index:3;transition:border-color var(--transition-base),box-shadow var(--transition-base)}.diagram .lvl__index{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;background:var(--text-default);color:var(--neutral-0);border-radius:var(--radius-full);font-size:10px;font-weight:var(--fw-bold);letter-spacing:0}.diagram .lvl__caption{position:absolute;top:14px;right:14px;font-family:var(--font-display);font-size:13px;font-weight:var(--fw-semibold);letter-spacing:var(--ls-tight);color:var(--text-default);background:color-mix(in srgb,var(--neutral-0) 78%,transparent);padding:4px 10px;border-radius:var(--radius-full);backdrop-filter:blur(4px);z-index:3}.diagram .lvl--cluster{inset:22px;background:linear-gradient(135deg,var(--lvl-cluster-tint) 0%,color-mix(in srgb,var(--brand-offwhite) 55%,var(--neutral-0)) 100%);border:1px solid var(--lvl-cluster-edge);box-shadow:inset 0 1px color-mix(in srgb,var(--neutral-0) 70%,transparent)}.diagram .lvl--industry{inset:18% 22% 14% 10%;background:linear-gradient(160deg,var(--lvl-industry-tint) 0%,color-mix(in srgb,var(--brand-paleblue) 35%,var(--neutral-0)) 100%);border:1px dashed var(--lvl-industry-edge)}.diagram .lvl--industry .lvl__tag{background:color-mix(in srgb,var(--brand-primary) 92%,var(--neutral-0));border-color:var(--brand-primary);color:var(--neutral-0)}.diagram .lvl--industry .lvl__index{background:var(--neutral-0);color:var(--brand-primary)}.diagram .lvl--container{inset:22% 12% 18% 8%;background:var(--lvl-container-bg);border:1px solid var(--lvl-container-edge);box-shadow:var(--shadow-md);overflow:hidden}.diagram .lvl--container .lvl__tag{background:var(--brand-primary);color:var(--neutral-0);border-color:var(--brand-primary);box-shadow:0 4px 12px -4px color-mix(in srgb,var(--brand-primary) 50%,transparent)}.diagram .lvl--container .lvl__index{background:var(--neutral-0);color:var(--brand-primary)}.diagram .lvl--container .lvl__caption{background:color-mix(in srgb,var(--brand-primary-50) 80%,transparent);color:var(--brand-primary)}.container__mock{position:absolute;left:14px;right:14px;bottom:14px;display:grid;gap:6px}.container__mock span{height:6px;border-radius:3px;background:linear-gradient(90deg,color-mix(in srgb,var(--brand-primary) 18%,var(--neutral-100)),color-mix(in srgb,var(--brand-primary) 5%,var(--neutral-100)))}.container__mock span:nth-child(1){width:60%;background:color-mix(in srgb,var(--brand-primary) 70%,transparent);height:10px;border-radius:4px}.container__mock span:nth-child(2){width:92%}.container__mock span:nth-child(3){width:76%}.container__mock span:nth-child(4){width:84%}.sibling{position:absolute;border:1px dashed color-mix(in srgb,var(--brand-primary) 24%,var(--border-default));border-radius:var(--radius-md);background:color-mix(in srgb,var(--neutral-0) 30%,transparent);display:flex;align-items:flex-end;padding:0 8px 6px;font-family:var(--font-mono);font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:color-mix(in srgb,var(--text-muted) 70%,transparent);pointer-events:none}.sibling--ind-a{top:18%;right:4%;width:14%;height:22%}.sibling--ind-b{bottom:14%;right:4%;width:14%;height:26%}.sibling--cont-a{top:22%;right:4%;width:22%;height:30%}.sibling--cont-b{bottom:18%;right:4%;width:22%;height:26%}.diagram .lvl--identity{position:absolute;top:-2%;bottom:-2%;left:64%;width:0;pointer-events:none;z-index:4}.lvl--identity .ident__line{position:absolute;left:50%;top:0;bottom:0;width:2px;transform:translate(-50%);background:linear-gradient(180deg,transparent 0%,var(--identity) 8%,var(--identity) 92%,transparent 100%);box-shadow:0 0 10px color-mix(in srgb,var(--identity) 55%,transparent)}.lvl--identity .ident__line:before,.lvl--identity .ident__line:after{content:"";position:absolute;left:50%;transform:translate(-50%);width:6px;height:6px;border-radius:50%;background:var(--identity);box-shadow:0 0 8px color-mix(in srgb,var(--identity) 70%,transparent)}.lvl--identity .ident__line:before{top:6%}.lvl--identity .ident__line:after{bottom:6%}.lvl--identity .ident__dot{position:absolute;left:50%;top:56%;width:16px;height:16px;transform:translate(-50%,-50%);border-radius:50%;background:var(--identity);box-shadow:0 0 0 6px color-mix(in srgb,var(--identity) 18%,transparent),0 0 0 12px color-mix(in srgb,var(--identity) 8%,transparent),0 6px 16px -4px color-mix(in srgb,var(--identity) 60%,transparent)}.lvl--identity .ident__dot:after{content:"";position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 35% 30%,color-mix(in srgb,var(--neutral-0) 70%,transparent) 0%,transparent 55%)}.lvl--identity .lvl__tag{position:absolute;left:50%;top:-8px;transform:translate(-50%,-100%);background:var(--neutral-900);color:var(--neutral-0);border-color:var(--neutral-900)}.lvl--identity .lvl__index{background:var(--identity);color:var(--neutral-900)}.diagram__shell:has(.legend__item[data-level=cluster]:is(:hover,:focus-visible)) .lvl--cluster{border-color:color-mix(in srgb,var(--brand-primary) 50%,var(--lvl-cluster-edge));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--brand-primary) 35%,transparent),inset 0 1px color-mix(in srgb,var(--neutral-0) 70%,transparent)}.diagram__shell:has(.legend__item[data-level=industry]:is(:hover,:focus-visible)) .lvl--industry{border-style:solid;border-color:var(--brand-primary);box-shadow:0 0 0 1px color-mix(in srgb,var(--brand-primary) 35%,transparent)}.diagram__shell:has(.legend__item[data-level=container]:is(:hover,:focus-visible)) .lvl--container{transform:translateY(-2px);box-shadow:var(--shadow-lg);border-color:var(--brand-primary)}.diagram__shell:has(.legend__item[data-level=identity]:is(:hover,:focus-visible)) .ident__dot{box-shadow:0 0 0 8px color-mix(in srgb,var(--identity) 26%,transparent),0 0 0 16px color-mix(in srgb,var(--identity) 12%,transparent),0 8px 22px -4px color-mix(in srgb,var(--identity) 70%,transparent)}.legend__item:focus-visible{outline:none;box-shadow:var(--focus-ring)}.legend{list-style:none;margin:0;padding:0;display:grid;gap:var(--space-3)}.legend__item{display:grid;grid-template-columns:auto 1fr;gap:var(--space-3) var(--space-4);padding:var(--space-4) var(--space-5);background:var(--bg-default);border:1px solid var(--border-default);border-radius:var(--radius-md);position:relative;isolation:isolate;cursor:default;transition:border-color var(--transition-base),background-color var(--transition-base),transform var(--transition-base)}.legend__item:before{content:"";position:absolute;left:0;top:14px;bottom:14px;width:3px;border-radius:0 3px 3px 0;background:var(--legend-accent, var(--border-default));transition:background-color var(--transition-base),width var(--transition-base)}.legend__item[data-level=cluster]{--legend-accent: var(--brand-skyblue)}.legend__item[data-level=industry]{--legend-accent: color-mix(in srgb, var(--brand-primary) 70%, var(--brand-skyblue))}.legend__item[data-level=container]{--legend-accent: var(--brand-primary)}.legend__item[data-level=identity]{--legend-accent: var(--brand-accent)}.legend__item:hover{border-color:color-mix(in srgb,var(--legend-accent) 50%,var(--border-default))}.legend__item:hover:before{width:4px}.legend__index{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:var(--radius-full);background:color-mix(in srgb,var(--legend-accent) 14%,transparent);color:var(--text-default);font-family:var(--font-mono);font-size:12px;font-weight:var(--fw-bold);letter-spacing:0;align-self:start}.legend__head{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--space-2) var(--space-3);margin-bottom:var(--space-2)}.legend__name{font-family:var(--font-display);font-size:1.0625rem;font-weight:var(--fw-bold);letter-spacing:var(--ls-tight);color:var(--text-default);margin:0}.legend__instance{font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);font-weight:var(--fw-medium);padding:2px 8px;background:color-mix(in srgb,var(--legend-accent) 14%,transparent);border-radius:var(--radius-full);white-space:nowrap}.legend__body{grid-column:2 / -1;font-size:var(--text-small);line-height:var(--lh-snug);color:var(--text-muted);margin:0;text-wrap:pretty}@media(max-width:980px){.legend__item{padding:var(--space-4)}.legend__item+.legend__item{margin-top:0}.legend__item+.legend__item:after{content:"";position:absolute;left:22px;top:-18px;width:1px;height:12px;background:color-mix(in srgb,var(--text-muted) 40%,transparent)}.legend{gap:var(--space-4)}}.diagram__foot{margin-top:var(--space-7);padding-top:var(--space-5);border-top:1px solid var(--border-default);display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:var(--space-4)}.diagram__close{font-family:var(--font-display);font-size:var(--text-h4);line-height:var(--lh-tight);letter-spacing:var(--ls-tight);color:var(--text-default);margin:0;max-width:55ch;font-weight:var(--fw-semibold);text-wrap:balance}.diagram__link{display:inline-flex;align-items:center;gap:var(--space-2);font-family:var(--font-display);font-weight:var(--fw-semibold);font-size:var(--text-small);color:var(--brand-primary);text-decoration:none;padding:8px 12px;border-radius:var(--radius-md);transition:background-color var(--transition-base),color var(--transition-base);white-space:nowrap}.diagram__link:hover{background:var(--brand-primary-50)}.diagram__link:focus{outline:none}.diagram__link:focus-visible{box-shadow:var(--focus-ring)}.diagram__link svg{transition:transform var(--transition-base)}.diagram__link:hover svg{transform:translate(3px)}.diagram[data-theme=dark]{background:#0a0d12;color:var(--neutral-50);--bg-default: #11161e;--bg-subtle: #0e131a;--border-default: #1f2937;--text-default: var(--neutral-50);--text-muted: #9ca3b3;--neutral-100: #1a212b;--neutral-0: #11161e;--lvl-cluster-tint: color-mix(in srgb, var(--brand-primary) 22%, #0e131a);--lvl-cluster-edge: color-mix(in srgb, var(--brand-skyblue) 28%, #1f2937);--lvl-industry-tint: color-mix(in srgb, var(--brand-primary) 35%, #0e131a);--lvl-industry-edge: color-mix(in srgb, var(--brand-skyblue) 50%, #1f2937);--lvl-container-bg: #161d27;--lvl-container-edge: color-mix(in srgb, var(--brand-skyblue) 55%, #1f2937)}.diagram[data-theme=dark] .diagram__title{color:var(--neutral-0)}.diagram[data-theme=dark] .diagram__eyebrow{color:var(--brand-skyblue)}.diagram[data-theme=dark] .diagram__close{color:var(--neutral-0)}.diagram[data-theme=dark] .diagram__canvas{background:radial-gradient(120% 80% at 0% 0%,color-mix(in srgb,var(--brand-primary) 22%,transparent),transparent 55%),radial-gradient(100% 90% at 100% 100%,color-mix(in srgb,var(--brand-accent) 14%,transparent),transparent 60%),#0e131a;border-color:#1f2937}.diagram[data-theme=dark] .diagram__canvas:before{color:color-mix(in srgb,var(--brand-skyblue) 22%,transparent);opacity:.5}.diagram[data-theme=dark] .lvl__tag{background:#11161e;border-color:#1f2937;color:var(--neutral-50)}.diagram[data-theme=dark] .lvl__index{background:var(--neutral-50);color:#0a0d12}.diagram[data-theme=dark] .lvl__caption{background:color-mix(in srgb,#11161e 78%,transparent);color:var(--neutral-50)}.diagram[data-theme=dark] .lvl--industry .lvl__tag{background:var(--brand-skyblue);color:#0a0d12;border-color:var(--brand-skyblue)}.diagram[data-theme=dark] .lvl--industry .lvl__index{background:#0a0d12;color:var(--brand-skyblue)}.diagram[data-theme=dark] .lvl--container .lvl__tag{background:var(--brand-primary);color:var(--neutral-0);border-color:var(--brand-primary)}.diagram[data-theme=dark] .lvl--container .lvl__caption{background:color-mix(in srgb,var(--brand-primary) 26%,transparent);color:var(--brand-paleblue)}.diagram[data-theme=dark] .container__mock span:nth-child(1){background:color-mix(in srgb,var(--brand-skyblue) 70%,transparent)}.diagram[data-theme=dark] .container__mock span{background:linear-gradient(90deg,color-mix(in srgb,var(--brand-skyblue) 26%,#1a212b),color-mix(in srgb,var(--brand-skyblue) 8%,#1a212b))}.diagram[data-theme=dark] .sibling{background:color-mix(in srgb,#0a0d12 30%,transparent);border-color:color-mix(in srgb,var(--brand-skyblue) 28%,#1f2937);color:color-mix(in srgb,var(--brand-skyblue) 55%,transparent)}.diagram[data-theme=dark] .lvl--identity .lvl__tag{background:var(--neutral-0);color:#0a0d12;border-color:var(--neutral-0)}.diagram[data-theme=dark] .lvl--identity .lvl__index{background:var(--brand-accent);color:#0a0d12}.diagram[data-theme=dark] .legend__item{background:#11161e;border-color:#1f2937}.diagram[data-theme=dark] .legend__item:hover{background:#141a23;border-color:color-mix(in srgb,var(--legend-accent) 60%,#1f2937)}.diagram[data-theme=dark] .legend__name{color:var(--neutral-0)}.diagram[data-theme=dark] .legend__index{color:var(--neutral-0);background:color-mix(in srgb,var(--legend-accent) 22%,transparent)}.diagram[data-theme=dark] .legend__instance{color:var(--brand-paleblue);background:color-mix(in srgb,var(--legend-accent) 22%,transparent)}.diagram[data-theme=dark] .diagram__link{color:var(--brand-skyblue)}.diagram[data-theme=dark] .diagram__link:hover{background:color-mix(in srgb,var(--brand-skyblue) 16%,transparent);color:var(--brand-paleblue)}.diagram[data-theme=dark] .diagram__foot{border-color:#1f2937}@media(prefers-reduced-motion:reduce){.diagram .lvl,.diagram .lvl__tag,.diagram .legend__item,.diagram .legend__item:before,.diagram .diagram__link,.diagram .diagram__link svg{transition:none}.diagram__shell:has(.legend__item[data-level=container]:is(:hover,:focus-visible)) .lvl--container{transform:none}}