.overview-nav{display:flex;gap:var(--space-1);align-items:center}.overview-nav a{padding:var(--space-2) var(--space-3);border-radius:999px;color:var(--muted);font-size:.75rem;font-weight:700;text-decoration:none}.overview-nav a:focus-visible,.overview-nav a:hover,.overview-nav a[aria-current=page]{background:var(--surface-soft);color:var(--ink)}.connection-portal{position:relative;display:grid;grid-column:1/-1;grid-template-columns:minmax(0,.95fr) minmax(420px,1.05fr);min-height:400px;gap:clamp(var(--space-8),5vw,72px);align-items:center;overflow:hidden;padding:clamp(var(--space-8),4vw,64px);background:radial-gradient(circle at 72% 45%,color-mix(in srgb,var(--data-cyan) 12%,transparent),transparent 31%),linear-gradient(135deg,var(--surface),color-mix(in srgb,var(--data-violet) 6%,var(--surface)))}.connection-copy{position:relative;z-index:2;min-width:0;max-width:none}.connection-copy h2{max-width:12.5em;margin:var(--space-2) 0 var(--space-4);font-size:clamp(2.25rem,3.2vw,3.35rem);letter-spacing:-.055em;line-height:1.1;overflow-wrap:normal;text-wrap:balance;word-break:keep-all}.connection-copy h2>span,.connection-description>span{display:block}.connection-support{width:min(calc(100% - var(--space-8)),32rem);margin-left:clamp(var(--space-6),3vw,var(--space-10))}.connection-description{max-width:48ch;margin:0;color:var(--muted);font-size:.875rem;line-height:1.75;overflow-wrap:normal;text-wrap:pretty;word-break:keep-all}.connection-description>span+span{margin-top:var(--space-1)}.connection-actions{display:grid;gap:var(--space-3);justify-items:start;margin-top:var(--space-6)}.connection-actions .primary-button{display:inline-flex;width:min(100%,19rem);align-items:center;justify-content:center;text-align:center;text-decoration:none;white-space:normal;word-break:keep-all}.connection-actions__status{display:inline-flex;flex-wrap:wrap;gap:var(--space-1);align-items:baseline;color:var(--muted);font-size:.75rem;line-height:1.5;overflow-wrap:normal;word-break:keep-all}.connection-actions strong{color:var(--ink)}.connection-preview{position:relative;width:100%;max-width:620px;min-height:310px;justify-self:center}.connection-preview__notice{position:absolute;z-index:1;top:var(--space-2);left:50%;margin:0;border:1px solid var(--line);border-radius:var(--radius-pill);background:color-mix(in srgb,var(--surface) 92%,transparent);padding:var(--space-1) var(--space-3);color:var(--muted);font-size:.75rem;font-weight:720;line-height:1.4;white-space:nowrap;transform:translateX(-50%)}.connection-preview:before{position:absolute;inset:3% 1%;border:1px solid color-mix(in srgb,var(--line) 80%,transparent);border-radius:50%;background:color-mix(in srgb,var(--surface) 58%,transparent);box-shadow:inset 0 0 80px color-mix(in srgb,var(--data-cyan) 9%,transparent);content:"";transform:rotate(-7deg)}.connection-preview svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 18px 22px color-mix(in srgb,var(--ink) 8%,transparent))}.connection-preview path{fill:none;stroke:color-mix(in srgb,var(--ink) 40%,transparent);stroke-linecap:round;stroke-width:2.6}.preview-node{--preview-tone:var(--accent)}.preview-node>circle{fill:color-mix(in srgb,var(--preview-tone) 14%,var(--surface));stroke:var(--preview-tone);stroke-width:3;filter:drop-shadow(0 10px 12px color-mix(in srgb,var(--preview-tone) 20%,transparent))}.preview-node--recorded>circle{fill:var(--preview-tone);stroke:var(--surface);stroke-width:2}.preview-node--inferred>circle{fill:var(--surface);stroke-dasharray:4 3}.preview-connection--inferred{stroke:var(--data-cyan);stroke-dasharray:7 6}.preview-node__label,.preview-node__type{font-family:var(--font-sans);text-anchor:middle}.preview-node__type{fill:var(--muted);font-size:12px;font-weight:680}.preview-node__label{fill:var(--ink);font-size:15px;font-weight:800;letter-spacing:-.045em;paint-order:stroke;stroke:var(--surface);stroke-linejoin:round;stroke-width:8px}.tone-one{--preview-tone:var(--accent)}.tone-two{--preview-tone:var(--data-cyan)}.tone-three{--preview-tone:var(--data-violet)}.tone-four{--preview-tone:var(--data-amber)}@media (max-width:900px){.connection-portal{grid-template-columns:1fr;min-height:0;padding:clamp(var(--space-7),5vw,var(--space-10))}.connection-copy{width:min(100%,44rem);justify-self:center}.connection-support{width:min(calc(100% - var(--space-5)),35rem);margin-left:clamp(var(--space-4),3vw,var(--space-8))}.connection-preview{max-width:620px;min-height:280px}}@media (max-width:620px){.overview-nav{position:fixed;z-index:30;right:auto;bottom:var(--space-3);left:50%;display:flex;width:max-content;border:1px solid var(--line);border-radius:var(--radius-pill);background:color-mix(in srgb,var(--surface) 92%,transparent);box-shadow:0 12px 35px color-mix(in srgb,var(--ink) 14%,transparent);padding:var(--space-1);transform:translateX(-50%);backdrop-filter:blur(14px)}.connection-portal{padding:var(--space-5)}.connection-copy h2{max-width:12.5em;font-size:clamp(1.9rem,9vw,2.55rem);overflow-wrap:normal;word-break:keep-all}.connection-support{width:100%;margin-left:0}.connection-actions{justify-items:stretch}.connection-actions .primary-button{width:100%}.connection-actions__status{justify-content:center}.connection-preview{min-height:220px}}