:root{--primary-color:#4f5b93;--primary-color-hover:#793862;--primary-color-light:#9ca7d8;--success-color:#79b933;--failure-color:#d84848;--bg-light:#f2f2f2;--bg-medium:#e1e1e1;--bg-dark:#a1a1a1;--font-family-mono:"Fira Mono", "Source Code Pro", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--font-family-sans-serif:"Fira Sans", "Source Sans Pro", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--border-radius:.75rem}html,body{text-align:center;height:100%;margin:0;font-size:clamp(14px,1.2vw,18px)}body{background-color:var(--bg-light);font-family:var(--font-family-sans-serif)}button,a.button{border-radius:var(--border-radius);cursor:pointer;min-width:2rem;line-height:1.5rem;font-family:var(--font-family-mono);border:.2rem solid #0000;padding:.25rem}:is(button,a.button):hover{filter:brightness(115%)}a.button{color:#dbe1ff;background-color:var(--primary-color);text-decoration:none}#exercise{flex-direction:column;height:100dvh;display:flex}#exercise header{height:5rem}#exercise main{flex-direction:column;flex:1;margin-inline:auto;display:flex}#exercise main>*{margin:1rem;padding:.5rem}#exercise main #answer,#exercise main #cards{gap:.5rem;height:2.5rem;display:flex}#exercise main #answer{border-bottom:.2rem solid var(--bg-dark);background-color:var(--bg-medium);border-radius:0}#exercise main #cards span.card{background-color:var(--primary-color-light)}#exercise main #cards span.card[data-is-placed=true] button.face{visibility:hidden}#exercise main span.card,#exercise main button.face{border-radius:var(--border-radius);height:2.5rem;display:block}#exercise main button.face{color:#dbe1ff;background-color:var(--primary-color)}#exercise footer{background-color:var(--bg-medium);flex-direction:row;justify-content:center;align-items:center;gap:3rem;height:5rem;display:flex}#exercise footer #result{flex-direction:row;align-items:center;gap:1rem;width:10rem;display:flex}#exercise footer #result i{background-color:#333;border-radius:50%;justify-content:center;align-items:center;width:2rem;height:2rem;padding:.5rem;display:flex}#exercise footer #result i.success{fill:var(--success-color)}#exercise footer #result i.failure{fill:var(--failure-color)}#exercise footer button{background-color:var(--success-color)}
