.interactive-figures{background:#fff;margin:0;padding:0;width:100%;scroll-margin-top:74px;position:relative}.interactive-figures-heading{position:absolute;left:20px;top:16px;z-index:2;pointer-events:none}.interactive-figures-heading h2,.interactive-figures-heading p{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.interactive-figures-heading a{display:inline-flex;min-height:44px;align-items:center;padding:8px 14px;border-radius:24px;background:#ffffffc9;color:#596a84;font:12px Arial,sans-serif;text-decoration:none;pointer-events:auto}.interactive-figures-heading a:focus-visible{outline:3px solid #a49dd9;outline-offset:4px}.interactive-figures iframe{display:block;border:0;width:100%;height:100svh;min-height:580px;background:#fff}@media(max-width:767px){.interactive-figures-heading{left:12px;top:10px}.interactive-figures-heading a{font-size:11px}}
/* Bounded game window: compact within the white page. */
.interactive-figures{padding:24px clamp(12px,3vw,48px) 40px;box-sizing:border-box}
.interactive-figures iframe{max-width:1180px;height:clamp(320px,42vw,520px);min-height:0;margin:0 auto;border:1px solid #e8ebf1;border-radius:22px;box-shadow:0 12px 36px #26355408;overflow:hidden}
@media(max-width:620px){.interactive-figures{padding:16px 12px 28px}.interactive-figures iframe{height:360px;border-radius:16px}}
@media(max-height:500px) and (orientation:landscape){.interactive-figures iframe{height:320px}}
/* Match the exact START sketch and card-grid gutters. */
:root{--source-layout-max:1440px;--source-layout-gutter:64px}
#start .sketch{max-width:var(--source-layout-max)}
#start[data-chip-compute] .variant-a{padding-left:var(--source-layout-gutter);padding-right:var(--source-layout-gutter)}
.interactive-figures{max-width:var(--source-layout-max);margin:0 auto;padding-left:var(--source-layout-gutter);padding-right:var(--source-layout-gutter)}
.interactive-figures iframe{max-width:none}
@media(max-width:1000px){:root{--source-layout-gutter:30px}}
@media(max-width:700px){:root{--source-layout-gutter:22px}}

/* Integrated source receiver. One canvas, no duplicate board. */
.pcb-portal-section{background:#fff;padding:30px 0 48px;scroll-margin-top:80px}.pcb-portal-section>h2{max-width:1180px;margin:0 auto 16px;padding:0 22px;text-align:center;font-size:clamp(24px,3.2vw,42px);letter-spacing:-.03em}.portal-integrated{max-width:1124px;padding:0 22px}.portal-integrated iframe{height:auto;aspect-ratio:1080/1340;border:0;border-radius:0;box-shadow:none;max-width:1080px}.portal-system-link{text-align:center;margin:4px auto 18px}.portal-system-link a{display:inline-flex;min-height:44px;align-items:center;padding:12px 30px;border:1px solid #bdb4c8;border-radius:10px;background:linear-gradient(#faf9fc,#dedbe3);box-shadow:inset 0 1px #fff,0 3px 8px #53426319;color:#684780;text-decoration:none;font:600 14px Arial,sans-serif}.portal-system-link a:focus-visible{outline:3px solid #a682c8;outline-offset:4px}.pcb-portal-section>.pcb-note{text-align:center;padding:0 22px;color:#6d6574;font-size:12px}@media(max-width:700px){.portal-integrated{padding:0 8px}.portal-integrated iframe{aspect-ratio:1080/1450}}
/* Figures belong to the page, not to an iframe/window. Only their hit targets receive input. */
.portal-integrated{position:relative;overflow:visible}.page-source-figures{position:absolute;inset:0;pointer-events:none;overflow:visible;z-index:3}.page-source-figure{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:center;transform:translate(-50%,-50%);width:max(64px,var(--figure-size));min-height:64px;padding:0;border:0;background:transparent;color:#594c66;font:12px Arial,sans-serif;pointer-events:auto;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;cursor:grab}.page-source-figure img{display:block;width:var(--figure-size);height:var(--figure-size);object-fit:contain;pointer-events:none}.page-source-figure span{white-space:nowrap;padding:3px 0}.page-source-figure:focus-visible{outline:2px solid #aa87cb;outline-offset:3px;border-radius:12px}.page-source-figure.is-dragging{cursor:grabbing;pointer-events:auto}.page-source-figure.is-pending{opacity:.25}.page-source-figure[hidden]{display:none}.touch-drag-enabled .page-source-figure{touch-action:none}.page-source-controls{display:flex;justify-content:center;align-items:center;gap:12px;flex-wrap:wrap;padding:6px 16px;font:12px Arial,sans-serif;color:#71617e}.page-source-controls button{min-height:44px;border:1px solid #ded4e8;border-radius:24px;padding:8px 15px;background:#fff;color:#705685;font:inherit}.page-touch-mode{display:none}@media(pointer:coarse){.page-touch-mode{display:block}}.page-source-controls button:focus-visible{outline:3px solid #ac88d0;outline-offset:3px}.page-source-hint{font-size:12px}@media(max-width:700px){.page-source-hint{width:100%;text-align:center}.page-source-figure{font-size:11px}}
.page-source-figure:not(.is-dragging) img{animation:page-figure-float 8s ease-in-out infinite alternate}.page-source-figure:nth-child(3n) img{animation-delay:-3s}.page-source-figure:nth-child(3n+1) img{animation-delay:-5s}@keyframes page-figure-float{from{transform:translateY(-3px) rotate(-2deg)}to{transform:translateY(3px) rotate(2deg)}}.motion-paused .page-source-figure img{animation-play-state:paused}@media(prefers-reduced-motion:reduce){.page-source-figure img{animation:none!important}}

.page-source-figures.is-offscreen img{animation-play-state:paused}

/* Direct drag is scoped to actual figure hit targets; empty page retains native scrolling/zoom. */
.page-source-figure{touch-action:none}