/* Self-contained educational plate; page typography and source figures remain unchanged. */
.edu-motion { max-width: 960px; margin: 24px 0 32px; color: var(--ink, #171717); font-family: inherit; }
.edu-motion-stage { min-height: 210px; padding: clamp(20px, 4vw, 40px); border: 1px solid var(--line, #dededb); border-radius: 16px; background: var(--surface, #f6f6f3); }
.edu-button { min-height: 44px; padding: 10px 20px; border: 1px solid currentColor; border-radius: 999px; background: transparent; color: inherit; font: inherit; cursor: pointer; }
.edu-button:focus-visible, .edu-motion a:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
.edu-feedback { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; }
.edu-feedback .edu-button { display: inline-flex; align-items: center; gap: 10px; }
.edu-spinner { display: none; width: 1em; height: 1em; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; }
.edu-feedback[data-phase="busy"] .edu-spinner { display: inline-block; animation: edu-spin .8s linear infinite; }
.edu-feedback[data-phase="success"] .edu-spinner { display: inline-block; border: 0; width: auto; height: auto; }
.edu-feedback[data-phase="success"] .edu-spinner::before { content: "✓"; }
.edu-status { min-height: 1.6em; margin: 12px 0 0; font-size: 14px; line-height: 1.6; }
.edu-items { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; }
.edu-items[hidden] { display: none; }
.edu-item, .edu-tile { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 10px 14px; border: 1px solid var(--line, #d4d4d0); border-radius: 10px; background: var(--background, #fff); }
.edu-items[data-state="closed"] .edu-item { opacity: 0; transform: translateY(24px); }
.edu-items[data-state="open"] .edu-item { opacity: 1; transform: translateY(0); }
.edu-tiles { display: flex; flex-wrap: wrap; gap: 10px; list-style: none; padding: 0; margin: 24px 0 0; }
.edu-tiles[data-view="list"] { flex-direction: column; align-items: flex-start; }
.edu-tile { width: 132px; box-sizing: border-box; }
.edu-motion-credit { margin: 10px 0 0; font-size: 12px; line-height: 1.7; color: var(--muted, #666); }
.edu-motion-credit a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
@keyframes edu-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .edu-feedback[data-phase="busy"] .edu-spinner { animation: none; } }