*{box-sizing:border-box}html{padding:0;border:0}body{--primary:#b1d4ff;--accent:#750D37;--background:#2e3844;--color:#FEFFFE;--border:#3f5572;--link:#b1d4ff}body.light{--primary:#b1d4ff;--accent:#fbddea;--background:#FEFFFE;--color:#2e3844;--border:#e1eaf5;--link:#2a5385}a:link,a:visited{color:var(--link)}header{display:flex;align-items:center;gap:1rem}body{min-height:100vh;display:grid;grid-template-rows:min-content auto min-content min-content;background:var(--background);color:var(--color);font-family:'Gill Sans','Gill Sans MT',Calibri,'Trebuchet MS',sans-serif;text-align:center;padding:0 1rem;margin:0}main{max-width:50rem;margin:0 auto}.card{display:grid;grid-template-columns:repeat(5,minmax(0,1fr))}input[type=checkbox]{appearance:none;width:0;height:0}select{padding:9px;background:0 0;color:var(--color);border-radius:4px}.cell{padding:1rem;border:solid 1px var(--border);display:flex;justify-content:center;align-items:center;gap:0;font-size:calc(((max(100vw,50rem)/ 5) - 2rem));font-size:calc(12px + (1rem - 12px) * ((100vw - 200px)/ (50rem - 200px)))}.cell span{columns:1;hyphens:auto}.cell img{max-height:50px;max-width:50px;object-fit:cover}.cell:focus-within,.cell:hover{border-color:var(--color);cursor:pointer}:where(.cell:hover,.cell:focus-within) span{transform:scale(1.25)}.cell.free,.cell:has(:checked){background-image:linear-gradient(to bottom right,transparent 0,transparent 45%,var(--accent) 45%,var(--accent) 55%,transparent 55%,transparent),linear-gradient(to bottom left,transparent 0,transparent 45%,var(--accent) 45%,var(--accent) 55%,transparent 55%,transparent)}.actions{margin:1rem 0;display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:.5rem}button{background:var(--primary);border:solid 1px var(--primary);padding:.5rem 1rem;border-radius:4px;text-transform:capitalize}button.secondary{background:0 0;color:var(--color)}footer{margin:2rem 0 0;padding:1rem;display:flex;flex-wrap:wrap;gap:1rem;align-items:center;justify-content:space-between;border-top:solid 1px var(--border)}