.page-component-host[data-component="serializability-swapping-game"]{margin-bottom:1.5em}.page-component-host[data-component="serializability-swapping-game"] .page-component-source{white-space:pre-wrap}.serializability-swapping-game{border:1px solid var(--b-line);background-color:var(--b-bg-1);padding:1rem;display:-ms-grid;display:grid;gap:0.75rem}.serializability-swapping-game__header{display:-ms-grid;display:grid;-ms-grid-columns:1fr auto 1fr;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem}.serializability-swapping-game__widget-title{font-weight:600;-ms-grid-column:2;grid-column:2;text-align:center}.serializability-swapping-game__button{-ms-grid-column:3;grid-column:3;-ms-grid-column-align:end;justify-self:end;min-width:7rem}.serializability-swapping-game__message{margin:0;min-height:1.5rem;color:var(--b-txt-dark)}.serializability-swapping-game__message--solved{color:#2a7b4f;font-weight:600}.serializability-swapping-game__operations{display:flex;flex-wrap:wrap;gap:0.45rem;align-items:flex-start}.serializability-swapping-game__operation-item{display:-ms-grid;display:grid;justify-items:center;gap:0.3rem}.serializability-swapping-game__operation{font-family:'Inconsolata', monospace;background-color:var(--b-bg-2);color:inherit;border:0;border-radius:0.25rem;padding:0.25rem 0.5rem;white-space:nowrap;cursor:pointer}.serializability-swapping-game__operation:hover{background-color:color-mix(in srgb, var(--b-focus) 18%, var(--b-bg-2))}.serializability-swapping-game__operation--selected{-webkit-box-shadow:0 0 0 2px var(--b-focus);box-shadow:0 0 0 2px var(--b-focus)}.serializability-swapping-game__operation--solved{background-color:color-mix(in srgb, #2a7b4f 18%, var(--b-bg-2));-webkit-box-shadow:0 0 0 2px #2a7b4f;box-shadow:0 0 0 2px #2a7b4f}.serializability-swapping-game__controls{min-height:2rem;display:flex;gap:0.35rem;align-items:center;justify-content:center}.serializability-swapping-game__controls--placeholder{visibility:hidden}.serializability-swapping-game__arrow{min-width:2.1rem;padding:0.15rem 0.35rem}@media (max-width: 700px){.serializability-swapping-game__header{-ms-grid-columns:1fr;grid-template-columns:1fr}.serializability-swapping-game__widget-title{grid-column:auto}.serializability-swapping-game__button{grid-column:auto;-ms-grid-column-align:stretch;justify-self:stretch}}