.keychain-play-controls{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:20px 0}.keychain-play-controls button{font:inherit;font-size:15px;padding:10px 8px;border:1px solid #9eb8a7;border-radius:7px;background:white;color:#193f2d;cursor:pointer}.keychain-play-controls button[aria-pressed=true]{background:#193f2d;color:white}.keychain-play-controls button:focus-visible{outline:3px solid #4b9cd3;outline-offset:3px}.keychain-play-content{padding:18px;border:1px solid #bbd0c2;border-radius:9px;background:#f3f8f4}.keychain-play-content h3{margin:0 0 12px;font-size:19px}.keychain-play-content p{font-size:16px;line-height:1.65}.keychain-play-content svg{display:block;width:100%;height:auto;max-height:280px}.keychain-svg-pair{display:grid;grid-template-columns:1fr 1fr;gap:16px}.keychain-svg-pair figure{margin:0;background:#dce8d9;padding:10px;border-radius:8px}.keychain-svg-pair figcaption{font-size:14px;text-align:center}.keychain-equation{font-weight:700}.keychain-part-map{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:16px 0}.keychain-part-map>div{display:grid;grid-template-columns:24px 1fr;gap:3px 8px;padding:12px;background:white;border:1px solid #b6cbbf;border-radius:7px;font-size:14px}.keychain-part-map span:not(.keychain-dot){grid-column:2}.keychain-dot{display:inline-block;width:20px;height:20px;border:1px solid #677970;border-radius:4px}.keychain-print-flow{padding-left:22px;margin:16px 0}.keychain-print-flow li{font-size:16px;line-height:1.65;margin:12px 0}.keychain-code{background:#142d23;color:#e4f4e9;font:14px/1.65 ui-monospace,monospace;padding:18px;border-radius:8px;white-space:pre-wrap;overflow-wrap:anywhere}@media(max-width:650px){.keychain-play-controls{grid-template-columns:1fr 1fr}.keychain-play-content{padding:14px}.keychain-svg-pair,.keychain-part-map{gap:8px}.keychain-part-map{grid-template-columns:1fr}.keychain-play-content svg{min-height:120px}}

.keychain-file-table{width:100%;border-collapse:collapse;font-size:14px;line-height:1.6;margin:16px 0}.keychain-file-table th,.keychain-file-table td{text-align:left;padding:12px;border-bottom:1px solid #bbcdc2;vertical-align:top}.keychain-file-table code{overflow-wrap:anywhere}@media(max-width:650px){.keychain-file-table th,.keychain-file-table td{padding:8px}}