.integration-board{--wall-ink: #123d47;--wall-muted: #6b787e;--wall-line: rgb(18 61 71 / 12%);--wall-surface: #fff;--wall-accent: #087f90;--wall-focus: #087f90}.platform-pages .integration-board{--wall-ink: var(--text);--wall-muted: var(--text-3);--wall-line: var(--line);--wall-surface: var(--surface-raised);--wall-accent: var(--accent);--wall-focus: var(--focus)}.integration-board{--ease-out: cubic-bezier(.22, 1, .36, 1);--tile: clamp(52px, 5.4vw, 74px);--gap: clamp(10px, 1vw, 14px);--step: calc(var(--tile) + var(--gap))}.integration-legend{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:0 auto 34px}.integration-chip{display:inline-flex;align-items:center;gap:9px;min-height:42px;padding:4px 14px 4px 5px;border:0;border-radius:var(--radius-control);color:var(--wall-ink);background:color-mix(in srgb,var(--wall-surface) 70%,transparent);box-shadow:inset 0 0 0 1px var(--wall-line);font:400 14px/1 var(--font-sans);cursor:pointer;transition:background-color .25s,box-shadow .25s,color .25s}.integration-chip:hover{background:var(--wall-surface)}.integration-chip[aria-pressed=true]{background:var(--wall-surface);box-shadow:inset 0 0 0 1px var(--wall-line),0 1px 2px #123d470d,0 10px 22px -14px #123d4759}.integration-chip:focus-visible{outline:2px solid var(--wall-focus);outline-offset:3px}.integration-chip__icon{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;color:var(--wall-accent);background:color-mix(in srgb,var(--wall-accent) 8%,transparent);transition:color .25s,background-color .25s,box-shadow .25s}.integration-chip[aria-pressed=true] .integration-chip__icon{color:#fff;background:var(--button-fill, var(--wall-accent)) var(--button-sheen, none);box-shadow:inset 0 1px #fff3}.integration-chip__count{min-width:22px;padding:4px 6px;border-radius:var(--radius-control);color:var(--wall-muted);background:color-mix(in srgb,var(--wall-ink) 5%,transparent);font-size:12px;text-align:center}.integration-wall{width:100vw;margin-inline:calc(50% - 50vw);overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent calc(50% - var(--columns) / 2 * var(--step)),#000 calc(50% - (var(--core-half) - .1) * var(--step)),#000 calc(50% + (var(--core-half) - .1) * var(--step)),transparent calc(50% + var(--columns) / 2 * var(--step))),linear-gradient(180deg,transparent 0,#000 calc(var(--step) * .95),#000 calc(100% - var(--step) * .95),transparent 100%);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent calc(50% - var(--columns) / 2 * var(--step)),#000 calc(50% - (var(--core-half) - .1) * var(--step)),#000 calc(50% + (var(--core-half) - .1) * var(--step)),transparent calc(50% + var(--columns) / 2 * var(--step))),linear-gradient(180deg,transparent 0,#000 calc(var(--step) * .95),#000 calc(100% - var(--step) * .95),transparent 100%);mask-composite:intersect}.integration-wall__grid{position:relative;display:grid;grid-template-columns:repeat(var(--columns),var(--tile));grid-auto-rows:var(--tile);justify-content:center;gap:var(--gap);margin:0;padding:0;list-style:none}.wall-tile{position:relative;display:grid;place-items:center;border-radius:22%;background:var(--wall-surface);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--wall-line) 80%,transparent),0 1px 2px #123d470a,0 10px 20px -16px #123d474d;transition:opacity .45s var(--ease-out),translate .5s var(--ease-out),background-color .45s,box-shadow .45s}.wall-tile>:is(img,svg){display:block;width:calc(100% * var(--icon-scale));height:auto;aspect-ratio:1;object-fit:contain;filter:grayscale(1) contrast(1.05);opacity:.55;transition:filter .45s,opacity .45s}.wall-tile>.wall-tile__app{width:64%;border-radius:18%}.wall-tile>.wall-tile__wordmark{width:72%;aspect-ratio:auto}.wall-tile>.wall-tile__glyph{width:40%;aspect-ratio:1;color:var(--wall-accent)}.wall-tile--ghost{background:color-mix(in srgb,var(--wall-surface) 45%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--wall-line) 55%,transparent)}.integration-board[data-lit] .wall-tile{opacity:.3}.integration-board[data-lit] .wall-tile[data-match]{opacity:1;translate:0 -3px;background:var(--brand-tint);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--wall-line) 60%,transparent),0 2px 4px #123d470f,0 18px 30px -18px #123d4773}.integration-board[data-lit] .wall-tile[data-match]>:is(img,svg){filter:none;opacity:1}.integration-board[data-lit] .wall-tile--ghost{opacity:.5}@media(hover:hover){.wall-tile:not(.wall-tile--ghost):hover{opacity:1;translate:0 -3px;background:var(--brand-tint);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--wall-line) 60%,transparent),0 2px 4px #123d470f,0 18px 30px -18px #123d4773}.wall-tile:not(.wall-tile--ghost):hover>:is(img,svg){filter:none;opacity:1}}.wall-tooltip{position:absolute;z-index:3;left:var(--x);top:var(--y);padding:6px 10px;border-radius:var(--radius-control);color:#fff;background:var(--wall-ink);box-shadow:0 8px 18px -10px #123d4799;font:400 12px/1.2 var(--font-sans);white-space:nowrap;pointer-events:none;translate:-50% calc(-100% - 10px);animation:wall-tooltip-in .2s var(--ease-out)}@keyframes wall-tooltip-in{0%{opacity:0;translate:-50% calc(-100% - 4px)}}@media(max-width:700px){.integration-legend{flex-wrap:nowrap;justify-content:flex-start;margin:0 -18px 22px;padding:2px 18px;overflow-x:auto;scrollbar-width:none}.integration-legend::-webkit-scrollbar{display:none}.integration-chip{flex:none}.integration-wall{width:auto;margin-inline:0;overflow:visible;-webkit-mask-image:none;mask-image:none}.integration-wall__grid{grid-template-columns:repeat(6,minmax(0,1fr));grid-auto-rows:auto;gap:8px}.wall-tile{aspect-ratio:1}.wall-tile--ghost{display:none}}@media(prefers-reduced-motion:reduce){.wall-tile,.wall-tile>:is(img,svg){transition:none}.integration-board[data-lit] .wall-tile[data-match]{translate:none}.wall-tile:not(.wall-tile--ghost):hover{translate:none}.wall-tooltip{animation:none}}