:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:medium}.pico{padding:1%;display:flex;flex-direction:column;gap:1em}body{display:flex;place-items:center;min-height:100vh;min-width:100vw}#app{display:grid;grid-template-columns:auto auto 6.7vw auto auto 6.7vw auto auto;grid-template-rows:repeat(5,6em);column-gap:.4em;row-gap:.4em;margin:auto}#app>:nth-child(6n+1){grid-column:1}#app>:nth-child(6n+2){grid-column:2}#app>:nth-child(6n+3){grid-column:4}#app>:nth-child(6n+4){grid-column:5}#app>:nth-child(6n+5){grid-column:7}#app>:nth-child(6n+6){grid-column:8}.cell{display:flex;width:9.5vw;min-width:10ch;max-width:6em;height:5.2em;align-items:center;justify-content:center;background-color:#1e90ff;color:#fff;font-size:100%;border-radius:.2em;transition:.3s scale,box-shadow;cursor:grab}.sortable-swap-highlight{background-color:#1fc7ff}.sortable-ghost{background-color:#289aff;box-shadow:rgba(100 100 111 .2) 0 7px 29px 5px;scale:1.05;cursor:grabbing}.changed{background-color:#00af5b}.changed.sortable-swap-highlight{background-color:#24e68b}svg{transform:translateY(-10%)}.sortable-drag,.sortable-chosen{cursor:grabbing}#app:has(.sortable-ghost) *{cursor:grabbing}@media(orientation:portrait){body{display:flex;width:fit-content;flex-direction:column;gap:5vh}.pico,#app{margin:0 auto}}